[add][button-loading]

src/entry/popup.js

@@ -7,13 +7,16 @@ const app = createApp(App)
 import router from '@/router/popup.js'
 import "ant-design-vue/dist/antd.css"; // or 'ant-design-vue/dist/antd.less'
 
-import { message } from "ant-design-vue";
+import {Button,message} from "ant-design-vue";
+
+
 message.config({
     top: `10px`,
     duration: 3,
     maxCount: 1,
 });
-app.use(message);
+app.use(Button);
+app.use(message)
 
 
 app.use(router)

src/view/popup/top-up/info.vue

@@ -36,11 +36,11 @@
                 <p>3、同一个地址可多次充值，不影响到账。最小充值金额 0.0001。</p>
             </div>
         </div>
+
         <!-- 底部 -->
         <div class="footer">
-            <div class="confirm-btn" @click="clickDone">
-                Done
-            </div>
+            <a-button class="confirm-btn" type="primary" shape="circle" :loading="state.loading" @click="clickDone">Done
+            </a-button>
         </div>
     </div>
 
@@ -52,6 +52,7 @@ import VHead from '@/view/popup/components/head.vue'
 import { useRouter } from "vue-router";
 import { getTokenRechargeAddress } from "@/http/pay";
 import { message } from 'ant-design-vue';
+
 import { syncChainTokenRechargeRecord } from "@/http/publishApi";
 
 
@@ -69,13 +70,20 @@ const asyncTokenRechRecord = (cb) => {
             currencyCode: top_up_info.currency_code
         }
     }).then(res => {
-        if (res.code == 0) {
-            router.back()
+        state.loading = false
+        switch (res.code.toString()) {
+            case "0":
+                router.back()
+                break
+            default:
+                message.error(res.msg)
+                break
         }
     })
 }
 
 const clickDone = () => {
+    state.loading = true
     asyncTokenRechRecord()
 }
 
@@ -273,7 +281,6 @@ onMounted(() => {
             width: 335px;
             height: 46px;
             text-align: center;
-            line-height: 46px;
             border-radius: 100px;
             background: #389aff;
             font-weight: 600;