登录页面预留扫码登录接口及input扫码内容自动填入隐藏域

imcs-ui/src/api/Login.js

@@ -1,42 +1,50 @@
-import axiosApi from './AxiosApi.js'
-
-const apiList = {
-  captcha: `/oauth/anno/captcha`,
-  login: `/oauth/anno/token`,
-  router: `/oauth/menu/router`,
-  resource: `/oauth/resource/visible`,
-}
-
-export default {
-  getCaptcha (randomId) {
-    return axiosApi({
-      method: 'GET',
-      url: apiList.captcha + `?key=${randomId}`,
-      responseType: 'arraybuffer',
-      meta: {
-        "X-isToken": false
-      }
-    })
-  },
-  login (data) {
-    return axiosApi({
-      method: 'POST',
-      url: apiList.login,
-      data
-    })
-  },
-  getRouter (data) {
-    return axiosApi({
-      method: 'GET',
-      url: apiList.router,
-      data: data || {}
-    })
-  },
-  getResource (data) {
-    return axiosApi({
-      method: 'GET',
-      url: apiList.resource,
-      data: data || {}
-    })
-  }
-}
+import axiosApi from './AxiosApi.js'
+
+const apiList = {
+  captcha: `/oauth/anno/captcha`,
+  login: `/oauth/anno/token`,
+  router: `/oauth/menu/router`,
+  resource: `/oauth/resource/visible`,
+  qcodelogin: `/oauth/anno/qcodelogin`,
+}
+
+export default {
+  getCaptcha (randomId) {
+    return axiosApi({
+      method: 'GET',
+      url: apiList.captcha + `?key=${randomId}`,
+      responseType: 'arraybuffer',
+      meta: {
+        "X-isToken": false
+      }
+    })
+  },
+  login (data) {
+    return axiosApi({
+      method: 'POST',
+      url: apiList.login,
+      data
+    })
+  },
+  getRouter (data) {
+    return axiosApi({
+      method: 'GET',
+      url: apiList.router,
+      data: data || {}
+    })
+  },
+  getResource (data) {
+    return axiosApi({
+      method: 'GET',
+      url: apiList.resource,
+      data: data || {}
+    })
+  },
+  qcodelogin (data) {
+    return axiosApi({
+      method: 'POST',
+      url: apiList.qcodelogin,
+      data
+    })
+  },
+}

imcs-ui/src/views/login/index.vue

@@ -187,6 +187,7 @@
           >
         </el-dropdown-menu>
       </el-dropdown>-->
+      <el-input id="qcodeUser" name="qcodeUser" v-model="loginForm.qcodeUser" type="hidden" onfocus=""  @input="showQcodeUser()"/>
     </el-form>
     <span class="login-footer">
       © 2019 - 2020
@@ -237,7 +238,8 @@
           bindAccount: "",
           bindPassword: "",
           signAccount: "",
-          signPassword: ""
+          signPassword: "",
+          qcodeUser: ""
         },
         rules: {
           account: {
@@ -319,6 +321,12 @@
     mounted() {
       db.clear();
       this.getCodeImage();
+      this.$nextTick(
+        window.onload = function () { // 光标默认位置
+            var oInput = document.getElementById('qcodeUser');
+            oInput.focus();
+        }
+      )
     },
     destroyed() {
       window.removeEventListener("message", this.resolveSocialLogin);
@@ -545,6 +553,31 @@
       },
       loginSuccessCallback(user) {
         console.log(user);
+      },
+
+      qcodelogin() {
+        this.loading = true;
+        const that = this;
+        this.loginForm.tenant = `${Base64.encode(this.loginForm.tenantView)}`;
+        this.$store.commit("account/setTenant", this.loginForm.tenant);
+        this.loginForm.grantType="password";
+        loginApi.qcodelogin(this.loginForm).then(response => {
+          const res = response.data;
+          if (res.isSuccess) {
+            that.saveLoginData(res.data['token'], res.data['refreshToken'], res.data['expiration']);
+            that.saveUserInfo(res.data);
+            that.getResource();
+          } else {
+            that.getCodeImage();
+          }
+        }).finally(() => that.loading = false);
+      },
+
+      showQcodeUser(){
+        console.log(this.loginForm.qcodeUser.substr(this.loginForm.qcodeUser.length-1,1));
+        if(this.loginForm.qcodeUser.substr(this.loginForm.qcodeUser.length-1,1) == "#"){
+            this.qcodelogin()
+        }
       }
     }
   };
@@ -575,7 +608,7 @@
       top: 44%;
       margin-top: -100px;
       color: #fff;
-      
+
 			img{
 				width: 300px;
 				margin-right: 40px;