diff --git a/frontend/src/layout/components/Topbar.vue b/frontend/src/layout/components/Topbar.vue
index ace9260a18..73b15d5afa 100644
--- a/frontend/src/layout/components/Topbar.vue
+++ b/frontend/src/layout/components/Topbar.vue
@@ -1,9 +1,9 @@
 <template>
   <div class="top-nav" :style="{'background-color': '#f1f3f8'}">
-    <div class="log">
+    <div v-loading="!axiosFinished" class="log">
       <!--      <img      v-if="!logoUrl" src="@/assets/DataEase-color.png" width="140" alt="" style="padding-top: 10px;">-->
-      <svg-icon v-if="!logoUrl" icon-class="DataEase" custom-class="top-nav-logo-icon" />
-      <img v-else :src="logoUrl" width="140" alt="" style="padding-top: 10px;">
+      <svg-icon v-if="!logoUrl && axiosFinished" icon-class="DataEase" custom-class="top-nav-logo-icon" />
+      <img v-else :src="logoUrl && axiosFinished" width="140" alt="" style="padding-top: 10px;">
     </div>
     <el-menu
       :active-text-color="variables.topMenuActiveText"
@@ -92,7 +92,8 @@ export default {
   data() {
     return {
       uiInfo: null,
-      logoUrl: null
+      logoUrl: null,
+      axiosFinished: false
     }
   },
 
@@ -137,6 +138,7 @@ export default {
       if (this.uiInfo['ui.logo'] && this.uiInfo['ui.logo'].paramValue) {
         this.logoUrl = '/system/ui/image/' + this.uiInfo['ui.logo'].paramValue
       }
+      this.axiosFinished = true
     })
   },
   methods: {
diff --git a/frontend/src/views/login/index.vue b/frontend/src/views/login/index.vue
index a3e86c78a6..8dfcf84ef7 100644
--- a/frontend/src/views/login/index.vue
+++ b/frontend/src/views/login/index.vue
@@ -40,9 +40,9 @@
             </div>
           </el-form>
         </el-col>
-        <el-col :span="12">
-          <div v-if="!loginImageUrl" class="login-image" />
-          <div v-else class="login-image-de" :style="{background:'url(' + loginImageUrl + ') no-repeat', 'backgroundSize':'cover'}" />
+        <el-col v-loading="!axiosFinished" :span="12">
+          <div v-if="!loginImageUrl && axiosFinished" class="login-image" />
+          <div v-if="loginImageUrl && axiosFinished" class="login-image-de" :style="{background:'url(' + loginImageUrl + ') no-repeat', 'backgroundSize':'contain'}" />
         </el-col>
       </el-row>
     </div>
@@ -95,7 +95,8 @@ export default {
       redirect: undefined,
       uiInfo: null,
       loginImageUrl: null,
-      loginLogoUrl: null
+      loginLogoUrl: null,
+      axiosFinished: false
     }
   },
   computed: {
@@ -115,6 +116,14 @@ export default {
     this.$store.dispatch('user/getUI').then(() => {
       // const uiLists = this.$store.state.user.uiInfo
       // this.uiInfo = format(uiLists)
+      this.axiosFinished = true
+      this.showLoginImage()
+    }).catch(err => {
+      console.error(err)
+    })
+  },
+  methods: {
+    showLoginImage() {
       this.uiInfo = getSysUI()
       if (this.uiInfo['ui.loginImage'] && this.uiInfo['ui.loginImage'].paramValue) {
         this.loginImageUrl = '/system/ui/image/' + this.uiInfo['ui.loginImage'].paramValue
@@ -122,11 +131,7 @@ export default {
       if (this.uiInfo['ui.loginLogo'] && this.uiInfo['ui.loginLogo'].paramValue) {
         this.loginLogoUrl = '/system/ui/image/' + this.uiInfo['ui.loginLogo'].paramValue
       }
-    }).catch(err => {
-      console.error(err)
-    })
-  },
-  methods: {
+    },
     handleLogin() {
       this.$refs.loginForm.validate(valid => {
         if (valid) {