<template>
|
<div id="content" class="content">
|
<!-- <div>
|
<div style="text-align:center">钉钉扫码登录</div>
|
<div id="self_defined_element" class="self-defined-classname"></div>
|
</div> -->
|
</div>
|
</template>
|
<script setup name="Oss" lang="ts">
|
import { useRoute } from 'vue-router';
|
import { dingdingLogin } from '@/api/system/user';
|
import { setToken } from '@/utils/auth';
|
|
const getUserDate = async (authCode: string, code: string) => {
|
await dingdingLogin({
|
authCode: authCode,
|
code: code
|
}).then((res: any) => {
|
var data = { value: 'admin', expirse: new Date().getTime() };
|
|
setToken(JSON.stringify(data));
|
window.location.href = '/index';
|
});
|
};
|
onMounted(() => {
|
const router = useRoute();
|
let code = router.query.code;
|
let authCode = router.query.authCode;
|
if (code) {
|
getUserDate(authCode, code);
|
} else {
|
window.location.href =
|
'https://login.dingtalk.com/oauth2/auth?redirect_uri=http://127.0.0.1:81/login&response_type=code&client_id=dingl5dxahaj3uzfug66&scope=oD9LphDV7Ge4vGgnIiS3WIwiEiE&state=dddd&prompt=consent';
|
// // STEP3：在需要的时候，调用 window.DTFrameLogin 方法构造登录二维码，并处理登录成功或失败的回调。
|
// window.DTFrameLogin(
|
// {
|
// id: 'self_defined_element',
|
// width: 300,
|
// height: 300
|
// },
|
// {
|
// redirect_uri: encodeURIComponent('http://127.0.0.1:8080/auth/dingdingLogin'),
|
// client_id: 'dingl5dxahaj3uzfug66',
|
// scope: 'openid',
|
// response_type: 'code',
|
// state: 'STATE',
|
// prompt: 'consent'
|
// },
|
// (loginResult: any) => {
|
// console.log('loginResult:' + loginResult);
|
|
// const { redirectUrl, authCode, state } = loginResult;
|
// // 这里可以直接进行重定向
|
// window.location.href = redirectUrl;
|
// // 也可以在不跳转页面的情况下，使用code进行授权
|
// console.log(authCode);
|
// },
|
// (errorMsg: any) => {
|
// // 这里一般需要展示登录失败的具体原因,可以使用toast等轻提示
|
// console.error(`errorMsg of errorCbk: ${errorMsg}`);
|
// }
|
// );
|
}
|
});
|
</script>
|
|
<style lang="scss" scoped>
|
.content {
|
display: flex;
|
align-items: center;
|
justify-content: center;
|
}
|
.self-defined-classname {
|
// width: 300px;
|
// height: 300px;
|
}
|
</style>
|
