OAuth2Login.vue
3.33 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
<template>
<div>
<div id="loader-wrapper">
<div id="loader"></div>
<div class="loader-section section-left"></div>
<div class="loader-section section-right"></div>
<div class="load_title">正在登录 华恒仓储管理系统,请耐心等待</div>
</div>
</div>
</template>
<script>
import { mapActions } from 'vuex'
import { isOAuth2AppEnv, timeFix } from '@/utils/util'
import { INDEX_MAIN_PAGE_PATH } from '@/store/mutation-types'
export default {
name: 'OAuth2Login',
data() {
return {
env: {
thirdApp: false,
wxWork: false,
dingtalk: false,
},
}
},
beforeCreate() {
// 如果当前 不是 OAuth2APP环境,就重定向到 /user/login 页面
if (!isOAuth2AppEnv()) {
this.$router.replace({path: '/user/login'})
}
},
created() {
this.checkEnv()
this.doOAuth2Login()
},
methods: {
...mapActions(['ThirdLogin']),
/** 检测当前的环境 */
checkEnv() {
// 判断当时是否是企业微信环境
if (/wxwork/i.test(navigator.userAgent)) {
this.env.thirdApp = true
this.env.wxWork = true
}
// 判断当时是否是钉钉环境
if (/dingtalk/i.test(navigator.userAgent)) {
this.env.thirdApp = true
this.env.dingtalk = true
}
},
/** 进行OAuth2登录操作 */
doOAuth2Login() {
if (this.env.thirdApp) {
// 判断是否携带了Token,是就说明登录成功
if (this.$route.query.oauth2LoginToken) {
this.thirdType = this.$route.query.thirdType
let token = this.$route.query.oauth2LoginToken
this.doThirdLogin(token)
} else if (this.env.wxWork) {
this.doWechatEnterpriseOAuth2Login()
} else if (this.env.dingtalk) {
this.doDingTalkOAuth2Login()
}
}
},
// 根据token执行登录
doThirdLogin(token) {
let param = {}
param.thirdType = this.thirdType
param.token = token
this.ThirdLogin(param).then(res => {
if (res.success) {
this.loginSuccess()
} else {
this.requestFailed(res)
}
})
},
loginSuccess() {
// 登陆成功,重定向到主页
this.$router.replace({path: INDEX_MAIN_PAGE_PATH})
// TODO 这个提示是否还需要?
this.$notification.success({
message: '欢迎',
description: `${timeFix()},欢迎回来`,
})
},
requestFailed(err) {
this.$error({
title: '登录失败',
content: ((err.response || {}).data || {}).message || err.message || '请求出现错误,请稍后再试',
okText: '重新登陆',
onOk() {
window.location.reload()
},
onCancel() {
window.location.reload()
},
})
},
/** 企业微信OAuth2登录 */
doWechatEnterpriseOAuth2Login() {
this.sysOAuth2Login('wechat_enterprise')
},
/** 钉钉OAuth2登录 */
doDingTalkOAuth2Login() {
this.sysOAuth2Login('dingtalk')
},
/** 后台构造oauth2登录地址 */
sysOAuth2Login(source) {
let url = `${window._CONFIG['domianURL']}/sys/thirdLogin/oauth2/${source}/login`
url += `?state=${encodeURIComponent(window.location.origin)}`
window.location.href = url
},
},
}
</script>
<style scoped>
</style>