|
@@ -1,6 +1,7 @@
|
|
|
<template>
|
|
|
<div id="login-text">飞书扫码登录</div>
|
|
|
<div id="login-container"></div>
|
|
|
+ <div id="login-click-text"> 扫码不便,<a @click="handleClickLogin">点击登录</a> </div>
|
|
|
</template>
|
|
|
|
|
|
<script lang="ts">
|
|
@@ -9,20 +10,28 @@
|
|
|
export default {
|
|
|
name: 'FeishuLoginQR',
|
|
|
data() {
|
|
|
- return {};
|
|
|
+ const { VITE_GLOB_FEISHU_APPID, VITE_GLOB_FEISHU_REDIRECTURI } = getFeiShuConfig();
|
|
|
+ const redirectUri = encodeURIComponent(VITE_GLOB_FEISHU_REDIRECTURI);
|
|
|
+ const gotoUrl = `https://passport.feishu.cn/suite/passport/oauth/authorize?client_id=${VITE_GLOB_FEISHU_APPID}&redirect_uri=${redirectUri}&response_type=code&state=STATE`;
|
|
|
+ return {
|
|
|
+ gotoUrl,
|
|
|
+ };
|
|
|
},
|
|
|
mounted() {
|
|
|
this.initQRCodeLogin();
|
|
|
},
|
|
|
methods: {
|
|
|
+ handleClickLogin() {
|
|
|
+ window.open(this.gotoUrl, '_self');
|
|
|
+ },
|
|
|
+
|
|
|
initQRCodeLogin() {
|
|
|
- const { VITE_GLOB_FEISHU_APPID, VITE_GLOB_FEISHU_REDIRECTURI } = getFeiShuConfig();
|
|
|
- const redirectUri = encodeURIComponent(VITE_GLOB_FEISHU_REDIRECTURI);
|
|
|
- const gotoUrl = `https://passport.feishu.cn/suite/passport/oauth/authorize?client_id=${VITE_GLOB_FEISHU_APPID}&redirect_uri=${redirectUri}&response_type=code&state=STATE`;
|
|
|
- console.log('=======gotoUrl', gotoUrl);
|
|
|
+ // const { VITE_GLOB_FEISHU_APPID, VITE_GLOB_FEISHU_REDIRECTURI } = getFeiShuConfig();
|
|
|
+ // const redirectUri = encodeURIComponent(VITE_GLOB_FEISHU_REDIRECTURI);
|
|
|
+ // const gotoUrl = `https://passport.feishu.cn/suite/passport/oauth/authorize?client_id=${VITE_GLOB_FEISHU_APPID}&redirect_uri=${redirectUri}&response_type=code&state=STATE`;
|
|
|
const QRLoginObj = window.QRLogin({
|
|
|
id: 'login-container',
|
|
|
- goto: gotoUrl,
|
|
|
+ goto: this.gotoUrl,
|
|
|
width: '300',
|
|
|
height: '300',
|
|
|
});
|
|
@@ -32,7 +41,7 @@
|
|
|
if (QRLoginObj.matchOrigin(event.origin) && QRLoginObj.matchData(event.data)) {
|
|
|
const loginTmpCode = event.data.tmp_code;
|
|
|
// 在授权页面地址上拼接上参数 tmp_code,并跳转
|
|
|
- window.location.href = `${gotoUrl}&tmp_code=${loginTmpCode}`;
|
|
|
+ window.location.href = `${this.gotoUrl}&tmp_code=${loginTmpCode}`;
|
|
|
}
|
|
|
};
|
|
|
if (typeof window.addEventListener != 'undefined') {
|
|
@@ -58,4 +67,10 @@
|
|
|
margin-top: 10px;
|
|
|
font-size: 14px;
|
|
|
}
|
|
|
+
|
|
|
+ #login-click-text {
|
|
|
+ text-align: center;
|
|
|
+ margin-top: 10px;
|
|
|
+ font-size: 14px;
|
|
|
+ }
|
|
|
</style>
|