Browse Source

✅ test: wecom scan test2

WanGxC 1 year ago
parent
commit
44d239e32c

+ 16 - 0
src/views/system/login/component/account.vue

@@ -92,6 +92,7 @@ import { BtnPermissionStore } from '/@/plugin/permission/store.permission'
 import { Md5 } from 'ts-md5'
 import { errorMessage } from '/@/utils/message'
 import { getWorkWeChatCode, postWorkWeChatCode } from '../api'
+import emitter from '/@/utils/emitter'
 
 export default defineComponent({
   name: 'loginAccount',
@@ -187,6 +188,21 @@ export default defineComponent({
       useUserInfo().setUserInfos()
     }
 
+    emitter.on('scan-wecomLogin', (userInfo: any) => {
+        if (userInfo.code === '2000') {
+          Session.set('token', userInfo.data.access)
+          Cookies.set('username', userInfo.data.name)
+          if (!themeConfig.value.isRequestRoutes) {
+            // 前端控制路由,2、请注意执行顺序
+            initFrontEndControlRoutes()
+            loginSuccess()
+          } else {
+            initBackEndControlRoutes()
+            loginSuccess()
+          }
+        }
+    })
+
     // 登录成功后的跳转
     const loginSuccess = () => {
       //登录成功获取用户信息,获取系统字典数据

+ 4 - 0
src/views/system/login/component/scan.vue

@@ -3,6 +3,7 @@ import { ref, defineComponent, onMounted } from 'vue';
 import QRCode from 'qrcodejs2-fixes';
 import * as ww from '@wecom/jssdk'
 import { WeComLogin } from '../api'
+import emitter from '/@/utils/emitter'
 
 function createWXQRCode() {
   ww.createWWLoginPanel({
@@ -33,6 +34,9 @@ async function handleWeComLogin(query) {
   try {
     const res = await WeComLogin(query)
     console.log('res', res)
+    if (res.code === '2000') {
+      emitter.emit('scan-wecomLogin', {loginInfo: res.data} )
+    }
   } catch (error) {
     console.log('error:', error)
   }

+ 35 - 14
src/views/system/login/index.vue

@@ -7,7 +7,9 @@ import logoMini from '/@/assets/logo-mini.svg'
 import loginMain from '/@/assets/login-main.svg'
 import loginBg from '/@/assets/login-bg.svg'
 import AnsjerImg from '/@/assets/ansjer_image.png'
-import { getWorkWeChatCode } from './api'
+import { getWorkWeChatCode, WeComLogin } from './api'
+import * as ww from '@wecom/jssdk'
+import emitter from '/@/utils/emitter'
 
 // 引入组件
 const Account = defineAsyncComponent(() => import('/@/views/system/login/component/account.vue'))
@@ -29,17 +31,40 @@ const getThemeConfig = computed(() => {
 
 const qrCode = ref('')
 
-async function fetchWorkWeChatCode() {
+function createWXQRCode() {
+  ww.createWWLoginPanel({
+    el: '#wx_qrcode',
+    params: {
+      login_type: 'CorpApp',
+      appid: 'ww467ec1685e8262e6',
+      agentid: '1000065',
+      redirect_uri: 'http://amzads.zositechc.cn/web/',
+      state: 'Wechat',
+      scope: 'snsapi_privateinfo',
+      redirect_type: 'callback',
+    },
+    onCheckWeComLogin({ isWeComLogin }) {
+      console.log(isWeComLogin)
+    },
+    onLoginSuccess({ code }) {
+      // console.log({ code })
+      handleWeComLogin({ code: code, state: 'Wechat' })
+    },
+    onLoginFail(err) {
+      console.log(err)
+    },
+  })
+}
+
+async function handleWeComLogin(query) {
   try {
-    if (!state.isScan) {
-      const response = await getWorkWeChatCode()
-      qrCode.value = response.data
-      window.location.href = qrCode.value
+    const res = await WeComLogin(query)
+    console.log('res', res)
+    if (res.code === '2000') {
+      emitter.emit('scan-wecomLogin', {loginInfo: res.data} )
     }
   } catch (error) {
     console.log('error:', error)
-  } finally {
-    state.isScan = !state.isScan
   }
 }
 
@@ -82,14 +107,10 @@ onMounted(() => {
                 <!-- <el-tab-pane :label="$t('message.label.two2')" name="mobile">
                   <Mobile />
                 </el-tab-pane> -->
-                <!-- 二维码扫码登录 -->
-                <!--<el-tab-pane :label="$t('message.label.qrcode')" name="QRCode">-->
-                <!--  <Account />-->
-                <!--</el-tab-pane>-->
               </el-tabs>
             </div>
-            <Scan v-if="state.isScan" :qrCode="qrCode" />
-            <div class="login-content-main-sacn" @click="fetchWorkWeChatCode">
+            <Scan v-if="state.isScan" />
+            <div class="login-content-main-sacn" @click="createWXQRCode">
               <i class="iconfont" :class="state.isScan ? 'icon-diannao1' : 'icon-barcode-qr'"></i>
               <div class="login-content-main-sacn-delta"></div>
             </div>