feat: 添加退款对应弹窗内容显示

src/pages/afterService/components/RefundModal/Balance/index.tsx

@@ -41,6 +41,9 @@ const Balance: React.FC<BalanceProps> = ({
   const [loading, setLoading] = useState(false);
 
   const getPayAssetAccountGetUserBalance = () => {
+    if (!purchaserId || !purchaserRoleId) {
+      return;
+    }
     setLoading(false);
     PublicApi.getPayAssetAccountGetChildUserBalance({
       childMemberId: `${purchaserId}`, 

src/pages/afterService/components/RefundModal/Credit/index.tsx

-import React, { useState } from 'react';
-import { Descriptions, Space, Button } from 'antd';
-
-interface bankAccount {
-  id: number, 
-  name: string, 
-  bankAccount: string, 
-  bankDeposit: string, 
-  memberId: number, 
-};
-
-interface BalanceProps {
-  /**
-   * 弹窗需要的数据值
-   */
-  value: {[key: string]: any};
-  /**
-   * 关闭事件
-   */
-  handleModalVisible: () => void; 
-  /**
-   * 弹窗内确认事件
-   */
-  handleConfirm: (values: {[key: string]: any}, modalName: string) => void; 
-  /**
-   * 弹窗提交 loading
-   */
-  submitLoading: boolean;
-};
-
-const Credit: React.FC<BalanceProps> = ({
-  handleModalVisible, 
-  handleConfirm, 
-  value, 
-  submitLoading, 
-}) => {
-  const [bankAccount, setBankAccount] = useState<bankAccount>({
-    id: 0, 
-    name: '', 
-    bankAccount: '', 
-    bankDeposit: '', 
-    memberId: 0, 
-  });
-
-  return (
-    <>
-      <Descriptions title="授信额度信息" column={1}>
-        <Descriptions.Item label="总授信额度">￥500000.00</Descriptions.Item>
-        <Descriptions.Item label="已用授信额度">￥500000.00</Descriptions.Item>
-        <Descriptions.Item label="可用授信额度">￥500000.00</Descriptions.Item>
-        <Descriptions.Item label="当前退款金额">
-          <span style={{ color: '#EF6260' }}>￥6000.00</span>
-        </Descriptions.Item>
-      </Descriptions>
-
-      <div style={{ marginTop: 20, textAlign: 'center' }}>
-        <Space>
-          <Button onClick={handleModalVisible}>
-            取消
-          </Button>
-          <Button
-            type="primary"
-            onClick={() => handleConfirm(value, 'credit')}
-            loading={submitLoading}
-          >
-            退款
-          </Button>
-        </Space>
-      </div>
-    </>
-  )
-};
-
+import React, { useState, useEffect } from 'react';
+import { Descriptions, Space, Button, Spin } from 'antd';
+import { PublicApi } from '@/services/api';
+
+interface Credit {
+  quota: number, 
+  useQuota: number, 
+  canUseQuota: number, 
+  isUsable: number, 
+};
+
+interface BalanceProps {
+  /**
+   * 弹窗需要的数据值
+   */
+  value: {[key: string]: any};
+  /**
+   * 关闭事件
+   */
+  handleModalVisible: () => void; 
+  /**
+   * 弹窗内确认事件
+   */
+  handleConfirm: (values: {[key: string]: any}, modalName: string) => void; 
+  /**
+   * 弹窗提交 loading
+   */
+  submitLoading: boolean;
+  /**
+   * 采购商id
+   */
+  purchaserId: number,
+  /**
+   * 采购商角色id
+   */
+  purchaserRoleId: number,
+  /**
+   * 供应商id
+   */
+  supplierId: number,
+  /**
+   * 供应商角色id
+   */
+  supplierRoleId: number,
+};
+
+const Credit: React.FC<BalanceProps> = ({
+  handleModalVisible, 
+  handleConfirm, 
+  value, 
+  submitLoading, 
+  purchaserId, 
+  purchaserRoleId, 
+  supplierId, 
+  supplierRoleId, 
+}) => {
+  const [credit, setCredit] = useState<Credit>({
+    quota: 0, 
+    useQuota: 0, 
+    canUseQuota: 0, 
+    isUsable: 0, 
+  });
+  const [loading, setLoading] = useState(false);
+
+  const getMemberCredit = () => {
+    if (
+      !purchaserId || 
+      !purchaserRoleId || 
+      !supplierId || 
+      !supplierRoleId
+    ) {
+      return;
+    }
+    setLoading(true);
+    PublicApi.getPayCreditGetMemberCredit({
+      memberId: `${purchaserId}`, 
+      roleId: `${purchaserRoleId}`, 
+      parentMemberId: `${supplierId}`, 
+      parentMemberRoleId: `${supplierRoleId}`, 
+    }).then(res => {
+      if (res.code === 1000) {
+        setCredit(res.data);
+      }
+    }).finally(() => {
+      setLoading(false);
+    });
+  };
+
+  useEffect(() => {
+    getMemberCredit();
+  }, []);
+
+  return (
+    <Spin spinning={loading}>
+      <Descriptions title="授信额度信息" column={1}>
+        <Descriptions.Item label="总授信额度">￥{credit.quota}</Descriptions.Item>
+        <Descriptions.Item label="已用授信额度">￥{credit.useQuota}</Descriptions.Item>
+        <Descriptions.Item label="可用授信额度">￥{credit.canUseQuota}</Descriptions.Item>
+        <Descriptions.Item label="当前退款金额">
+          <span style={{ color: '#EF6260' }}>￥{value.refundAmount}</span>
+        </Descriptions.Item>
+      </Descriptions>
+
+      <div style={{ marginTop: 20, textAlign: 'center' }}>
+        <Space>
+          <Button onClick={handleModalVisible}>
+            取消
+          </Button>
+          <Button
+            type="primary"
+            onClick={() => handleConfirm(value, 'credit')}
+            loading={submitLoading}
+          >
+            退款
+          </Button>
+        </Space>
+      </div>
+    </Spin>
+  )
+};
+
 export default Credit;
\ No newline at end of file

src/pages/afterService/components/RefundModal/UploadVoucher/index.tsx

@@ -7,10 +7,11 @@ import { uploadVoucherModalSchema } from './schema';
 
 const uploadVoucherFormActions = createFormActions();
 
-interface bankAccount {
+interface BankAccount {
   name: string, 
   bankAccount: string, 
   bankDeposit: string, 
+  id: number,
 };
 
 interface UploadVoucherProps {
@@ -48,22 +49,23 @@ const UploadVoucher: React.FC<UploadVoucherProps> = ({
   purchaserId, 
   purchaserRoleId, 
 }) => {
-  const [bankAccount, setBankAccount] = useState<bankAccount>({
+  const [bankAccount, setBankAccount] = useState<BankAccount>({
     name: '', 
     bankAccount: '', 
     bankDeposit: '', 
+    id: 0,
   });
   const [loading, setLoading] = useState(false);
 
   // 获取对公账户信息
-  const getSettleAccountsCorporateAccountConfig = (memberId: number, memberRoleId: number) => {
-    if (!memberId || !memberRoleId) {
+  const getSettleAccountsGetMemberAccountConfig = () => {
+    if (!purchaserId || !purchaserRoleId) {
       return;
     }
     setLoading(true);
-    PublicApi.getSettleAccountsCorporateAccountConfig({
-      memberId: `${memberId}`, 
-      memberRoleId: `${memberRoleId}`, 
+    PublicApi.getSettleAccountsGetMemberAccountConfig({
+      memberId: `${purchaserId}`, 
+      roleId: `${purchaserRoleId}`, 
     }).then(res => {
       if (res.code === 1000) {
         setBankAccount(res.data);
@@ -74,11 +76,10 @@ const UploadVoucher: React.FC<UploadVoucherProps> = ({
   };
 
   useEffect(() => {
-    getSettleAccountsCorporateAccountConfig(purchaserId, purchaserRoleId);
+    getSettleAccountsGetMemberAccountConfig();
   }, []);
 
   const beforeUploadVoucher = file => {
-    console.log(file.size)
     if (file.size / 1024 > 200) {
       message.warning('图片大小超过200K');
       return Promise.reject();
@@ -86,17 +87,17 @@ const UploadVoucher: React.FC<UploadVoucherProps> = ({
   };
 
   const handleUploadVoucherSubmit = values => {
-    const { fileList = [] } = values;
+    const { fileList = [], id, ...rest } = values;
 
     if (handleConfirm) {
-      if (!bankAccount || !bankAccount.name) {
+      if (!bankAccount || !bankAccount.id) {
         message.error('没有收款账户相关信息，无法退款');
         return;
       }
       handleConfirm({
         ...value, 
         payProve: {
-          ...values, 
+          ...rest, 
           fileList: fileList.map(item => item.status === 'done' && ({
             name: item.name, 
             proveUrl: item.data.url,
@@ -110,7 +111,7 @@ const UploadVoucher: React.FC<UploadVoucherProps> = ({
     <Spin spinning={loading}>
       <NiceForm
         previewPlaceholder=""
-        initialValues={bankAccount}
+        value={bankAccount}
         effects={($, { setFieldState }) => {
           
         }}

src/pages/afterService/components/RefundModal/index.tsx

@@ -41,6 +41,13 @@ const RefundModal: React.FC<RefundModalProps> = ({
   value, 
   submitLoading, 
 }) => {
+  const { 
+    purchaserId, 
+    purchaserRoleId, 
+    supplierId, 
+    supplierRoleId, 
+    ...rest
+  } = value;
 
   const tempMap = {
     uploadVoucher: {
@@ -49,9 +56,9 @@ const RefundModal: React.FC<RefundModalProps> = ({
       render: () => (
         <Suspense fallback={null}>
           <UploadVoucher
-            value={value}
-            purchaserId={value.purchaserId}
-            purchaserRoleId={value.purchaserRoleId}
+            value={rest}
+            purchaserId={purchaserId}
+            purchaserRoleId={purchaserRoleId}
             handleConfirm={handleConfirm}
             handleModalVisible={handleModalVisible}
             submitLoading={submitLoading}
@@ -65,7 +72,9 @@ const RefundModal: React.FC<RefundModalProps> = ({
       render: () => (
         <Suspense fallback={null}>
           <Balance
-            value={value}
+            value={rest}
+            purchaserId={purchaserId}
+            purchaserRoleId={purchaserRoleId}
             handleConfirm={handleConfirm}
             handleModalVisible={handleModalVisible}
             submitLoading={submitLoading}
@@ -79,7 +88,11 @@ const RefundModal: React.FC<RefundModalProps> = ({
       render: () => (
         <Suspense fallback={null}>
           <Credit
-            value={value}
+            value={rest}
+            purchaserId={purchaserId}
+            purchaserRoleId={purchaserRoleId}
+            supplierId={supplierId}
+            supplierRoleId={supplierRoleId}
             handleConfirm={handleConfirm}
             handleModalVisible={handleModalVisible}
             submitLoading={submitLoading}
@@ -93,7 +106,7 @@ const RefundModal: React.FC<RefundModalProps> = ({
       render: () => (
         <Suspense fallback={null}>
           <COD
-            value={value}
+            value={rest}
             handleConfirm={handleConfirm}
             handleModalVisible={handleModalVisible}
             submitLoading={submitLoading}

src/pages/afterService/components/ReturnDetailInfo/index.tsx

@@ -2,7 +2,7 @@
  * @Author: XieZhiXiong
  * @Date: 2020-11-05 18:02:18
  * @LastEditors: XieZhiXiong
- * @LastEditTime: 2020-12-28 13:53:00
+ * @LastEditTime: 2020-12-29 11:00:22
  * @Description: 退款明细
  */
 import React, { useState } from 'react';
@@ -66,6 +66,14 @@ interface ReturnDetailInfoProps {
    * 采购商角色id
    */
   purchaserRoleId: number,
+  /**
+   * 供应商id
+   */
+  supplierId: number,
+  /**
+   * 供应商角色id
+   */
+  supplierRoleId: number,
 };
 
 const ReturnDetailInfo: React.FC<ReturnDetailInfoProps> = ({
@@ -76,6 +84,8 @@ const ReturnDetailInfo: React.FC<ReturnDetailInfoProps> = ({
   innerStatus, 
   purchaserId, 
   purchaserRoleId, 
+  supplierId, 
+  supplierRoleId, 
 }) => {
   const [visibleResult, setVisibleResult] = useState(false);
   const [notReceivedLoading, setNotReceivedLoading] = useState(false);
@@ -159,21 +169,37 @@ const ReturnDetailInfo: React.FC<ReturnDetailInfoProps> = ({
       case PAY_CHANNEL_BALANCE: {
         setModalName('balance');
         setRefundModalVisible(true);
-        setRefundModalValue({ id, refundAmount: amount });
+        setRefundModalValue({ 
+          id, 
+          refundAmount: amount, 
+          purchaserId, 
+          purchaserRoleId, 
+        });
         break;
       };
       // 线下支付
       case PAY_CHANNEL_OFFLINE: {
         setModalName('uploadVoucher');
         setRefundModalVisible(true);
-        setRefundModalValue({ id, purchaserId, purchaserRoleId });
+        setRefundModalValue({ 
+          id, 
+          purchaserId, 
+          purchaserRoleId, 
+        });
         break;
       };
       // 授信支付
       case PAY_CHANNEL_CREDIT: {
         setModalName('credit');
         setRefundModalVisible(true);
-        setRefundModalValue({ id, refundAmount: amount });
+        setRefundModalValue({ 
+          id, 
+          refundAmount: amount, 
+          purchaserId, 
+          purchaserRoleId, 
+          supplierId, 
+          supplierRoleId, 
+        });
         break;
       };
       // 货到付款

src/pages/afterService/returnApplication/components/DetailInfo/index.tsx

@@ -418,6 +418,8 @@ const DetailInfo: React.FC<DetailInfoProps> = ({
                     innerStatus={detailInfo?.innerStatus}
                     purchaserId={detailInfo?.memberId}
                     purchaserRoleId={detailInfo?.roleId}
+                    supplierId={detailInfo?.parentMemberId}
+                    supplierRoleId={detailInfo?.parentMemberRoleId}
                     isPurchaser
                   />
                 </Suspense>
@@ -468,8 +470,8 @@ const DetailInfo: React.FC<DetailInfoProps> = ({
           </Col>
 
           <Col span={24}>
-             {/* 内、外部流转记录 */}
-             <Suspense fallback={null}>
+            {/* 内、外部流转记录 */}
+            <Suspense fallback={null}>
               <FlowRecords 
                 fetchOuterHistory={fetchOuterHistory}
                 fetchInnerHistory={fetchInnerHistory}

src/pages/afterService/returnManage/components/DetailInfo/index.tsx

@@ -465,6 +465,8 @@ const DetailInfo: React.FC<DetailInfoProps> = ({
                     innerStatus={detailInfo?.innerStatus}
                     purchaserId={detailInfo?.memberId}
                     purchaserRoleId={detailInfo?.roleId}
+                    supplierId={detailInfo?.parentMemberId}
+                    supplierRoleId={detailInfo?.parentMemberRoleId}
                   />
                 </Suspense>
               </Col>