From 7564997aba5f1378ab3b37489a18ca7bb60d2574 Mon Sep 17 00:00:00 2001
From: ruibaby <i@ryanc.cc>
Date: Thu, 30 Jan 2020 12:41:06 +0800
Subject: [PATCH] feat: add the load animation to the login button.

---
 src/views/user/Login.vue | 20 ++++++++++++++------
 1 file changed, 14 insertions(+), 6 deletions(-)

diff --git a/src/views/user/Login.vue b/src/views/user/Login.vue
index 4e1f7d98..1caddda7 100644
--- a/src/views/user/Login.vue
+++ b/src/views/user/Login.vue
@@ -47,6 +47,7 @@
           :style="{'animation-delay': '0.3s'}"
         >
           <a-button
+            :loading="landing"
             type="primary"
             :block="true"
             @click="handleLogin"
@@ -139,7 +140,8 @@ export default {
       apiModifyVisible: false,
       defaultApiBefore: window.location.protocol + '//',
       apiUrl: window.location.host,
-      resetPasswordButton: false
+      resetPasswordButton: false,
+      landing: false
     }
   },
   computed: {
@@ -169,11 +171,17 @@ export default {
         this.$message.warn('密码不能为空！')
         return
       }
-
-      this.login({ username: this.username, password: this.password }).then(response => {
-        // Go to dashboard
-        this.loginSuccess()
-      })
+      this.landing = true
+      this.login({ username: this.username, password: this.password })
+        .then(response => {
+          // Go to dashboard
+          this.loginSuccess()
+        })
+        .finally(() => {
+          setTimeout(() => {
+            this.landing = false
+          }, 500)
+        })
     },
     loginSuccess() {
       // Cache the user info