🎨优化ui

src/assets/styles/login.scss

@@ -1,4 +1,4 @@
-.login {
+.login-wrap {
   background: radial-gradient(220% 105% at top center, #1b2947 10%, #4b76a7 40%, #81acae 65%, #f7f7b6);
   background-attachment: fixed;
   overflow: hidden;
@@ -8,6 +8,14 @@
   height: 100%;
   // background-image: url('@/assets/images/login-bg.jpg');
   background-size: cover;
+  flex-direction: column;
+
+  .login {
+    margin: 0 auto;
+    background: #ffffff;
+    border-radius: 6px;
+    width: var(--base-login-width);
+  }
 }
 
 .title {
@@ -17,13 +25,9 @@
 }
 
 .login-form {
-  border-radius: 6px;
-  background: #ffffff;
-  // background-color: hsla(0, 0%, 100%, 0.3);
-  width: var(--base-login-width);
-  height: 300px;
   padding: 35px 15px 5px 15px;
   position: relative;
+  height: 300px;
 
   .input-icon {
     height: 39px;

src/assets/styles/variables.module.scss

@@ -19,7 +19,7 @@ $panGreen: #30b08f;
   --base-tags-height: 34px;
   --base-header-height: 50px;
   //登录框宽度
-  --base-login-width: 280px;
+  --base-login-width: 320px;
 }
 
 /***侧边栏深色配置***/

src/utils/signalR.js

@@ -80,7 +80,7 @@ export default {
     connection.on('welcome', (data) => {
       ElNotification.info(data)
     })
-    connection.on('getConnId', (data) => {
+    connection.on('connId', (data) => {
       // useUserStore().saveConnId(data)
     })
     // 接收后台手动推送消息

src/views/login.vue

@@ -1,5 +1,6 @@
 <template>
   <starBackground></starBackground>
+  <div class="login-wrap">
     <div class="login">
       <el-form ref="loginRef" :model="loginForm" :rules="loginRules" class="login-form" v-if="!showQrLogin">
         <h3 class="title">{{ defaultSettings.title }}</h3>
@@ -48,14 +49,7 @@
             <span v-else>登 录 中...</span>
           </el-button>
         </el-form-item>
-      <div class="other-login" v-if="defaultSettings.showOtherLogin">
-        <el-divider>{{ $t('login.otherLoginWay') }}</el-divider>
-
-        <span @click="onAuth('GITHUB')" title="github"><svg-icon name="github" className="login-icon"></svg-icon></span>
-        <span @click="onAuth('GITEE')" title="gitee"><svg-icon name="gitee" className="login-icon"></svg-icon></span>
-      </div>
       </el-form>
-
       <div class="qr-wrap login-form" v-else>
         <h3 class="title">移动端扫码登录</h3>
         <div class="scan-wrap" @click="handleShowQrLogin()">
@@ -68,6 +62,13 @@
         </div>
       </div>
 
+      <div class="other-login" v-if="defaultSettings.showOtherLogin">
+        <el-divider>{{ $t('login.otherLoginWay') }}</el-divider>
+
+        <span @click="onAuth('GITHUB')" title="github"><svg-icon name="github" className="login-icon"></svg-icon></span>
+        <span @click="onAuth('GITEE')" title="gitee"><svg-icon name="gitee" className="login-icon"></svg-icon></span>
+      </div>
+    </div>
     <!--  底部  -->
     <div class="el-login-footer">
       <div v-html="defaultSettings.copyright"></div>
@@ -222,7 +223,7 @@ function generateCode() {
     }
   })
   interval.value = setInterval(() => {
-    verifyScan({ uuid: uuid })
+    verifyScan({ uuid: uuid, deviceId: visitorId })
       .then((res) => {
         const { code, data } = res
         if (data.status == -1) {