From bd22fee12de850f9ef0e446f1b873f0f5429b43f Mon Sep 17 00:00:00 2001
From: CaIon <1808837298@qq.com>
Date: Wed, 11 Oct 2023 14:57:55 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E5=85=85=E5=80=BC=E5=89=8D=E5=BC=B9?=
 =?UTF-8?q?=E7=AA=97=E7=A1=AE=E8=AE=A4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 web/src/pages/TopUp/index.js | 33 ++++++++++++++++++++++++++++-----
 1 file changed, 28 insertions(+), 5 deletions(-)

diff --git a/web/src/pages/TopUp/index.js b/web/src/pages/TopUp/index.js
index 1ad5b0d4..bc182ce7 100644
--- a/web/src/pages/TopUp/index.js
+++ b/web/src/pages/TopUp/index.js
@@ -1,5 +1,5 @@
 import React, {useEffect, useState} from 'react';
-import {Button, Form, Grid, Header, Segment, Statistic} from 'semantic-ui-react';
+import {Button, Confirm, Form, Grid, Header, Segment, Statistic} from 'semantic-ui-react';
 import {API, showError, showInfo, showSuccess} from '../../helpers';
 import {renderNumber, renderQuota} from '../../helpers/render';
 
@@ -11,6 +11,8 @@ const TopUp = () => {
     const [topUpLink, setTopUpLink] = useState('');
     const [userQuota, setUserQuota] = useState(0);
     const [isSubmitting, setIsSubmitting] = useState(false);
+    const [open, setOpen] = useState(false);
+    const [payWay, setPayWay] = useState('');
 
     const topUp = async () => {
         if (redemptionCode === '') {
@@ -47,15 +49,24 @@ const TopUp = () => {
         window.open(topUpLink, '_blank');
     };
 
-    const onlineTopUp = async (payment) => {
+    const preTopUp = async (payment) => {
         if (amount === 0) {
             await getAmount();
         }
+        setPayWay(payment)
+        setOpen(true);
+    }
+
+    const onlineTopUp = async () => {
+        if (amount === 0) {
+            await getAmount();
+        }
+        setOpen(false);
         try {
             const res = await API.post('/api/user/pay', {
                 amount: parseInt(topUpCount),
                 top_up_code: topUpCode,
-                PaymentMethod: payment
+                PaymentMethod: payWay
             });
             if (res !== undefined) {
                 const {message, data} = res.data;
@@ -145,9 +156,21 @@ const TopUp = () => {
         }
     }
 
+    const handleCancel = () => {
+        setOpen(false);
+    }
+
     return (
         <div>
             <Segment>
+                <Confirm
+                    open={open}
+                    content={'充值数量：' + topUpCount + '，充值金额：' + renderAmount() + '，是否确认充值？'}
+                    cancelButton='取消充值'
+                    confirmButton="确定"
+                    onCancel={handleCancel}
+                    onConfirm={onlineTopUp}
+                />
                 <Header as='h3'>充值额度</Header>
                 <Grid columns={2} stackable>
                     <Grid.Column>
@@ -204,14 +227,14 @@ const TopUp = () => {
                             {/*/>*/}
                             <Button color='blue' onClick={
                                 async () => {
-                                    onlineTopUp('zfb')
+                                    preTopUp('zfb')
                                 }
                             }>
                                 支付宝
                             </Button>
                             <Button color='green' onClick={
                                 async () => {
-                                    onlineTopUp('wx')
+                                    preTopUp('wx')
                                 }
                             }>
                                 微信