fix: 三方登录未携带租户

This commit is contained in:
xingyu 2022-12-06 21:30:44 +08:00
parent 2513bbf02d
commit c720b1dff9
3 changed files with 110 additions and 63 deletions

View File

@ -57,7 +57,7 @@ export const smsLoginApi = (data: SmsLoginVO) => {
}
// 社交授权的跳转
export const socialAuthRedirectApi = (type: string, redirectUri: string) => {
export const socialAuthRedirectApi = (type: number, redirectUri: string) => {
return request.get({
url: '/system/auth/social-auth-redirect?type=' + type + '&redirectUri=' + redirectUri
})

View File

@ -16,7 +16,7 @@
</el-form-item>
</el-col>
<el-col :span="24" style="padding-left: 10px; padding-right: 10px">
<el-form-item prop="tenantName">
<el-form-item prop="tenantName" v-if="loginData.tenantEnable === 'true'">
<el-input
type="text"
v-model="loginData.loginForm.tenantName"
@ -65,9 +65,13 @@
</el-col>
<el-col :span="24" style="padding-left: 10px; padding-right: 10px">
<el-form-item>
<el-button :loading="loginLoading" type="primary" class="w-[100%]" @click="getCode()">
{{ t('login.login') }}
</el-button>
<XButton
:loading="loginLoading"
type="primary"
class="w-[100%]"
:title="t('login.login')"
@click="getCode()"
/>
</el-form-item>
</el-col>
<Verify
@ -81,19 +85,25 @@
<el-form-item>
<el-row justify="space-between" style="width: 100%" :gutter="5">
<el-col :span="8">
<el-button class="w-[100%]" @click="setLoginState(LoginStateEnum.MOBILE)">
{{ t('login.btnMobile') }}
</el-button>
<XButton
class="w-[100%]"
:title="t('login.btnMobile')"
@click="setLoginState(LoginStateEnum.MOBILE)"
/>
</el-col>
<el-col :span="8">
<el-button class="w-[100%]" @click="setLoginState(LoginStateEnum.QR_CODE)">
{{ t('login.btnQRCode') }}
</el-button>
<XButton
class="w-[100%]"
:title="t('login.btnQRCode')"
@click="setLoginState(LoginStateEnum.QR_CODE)"
/>
</el-col>
<el-col :span="8">
<el-button class="w-[100%]" @click="setLoginState(LoginStateEnum.REGISTER)">
{{ t('login.btnRegister') }}
</el-button>
<XButton
class="w-[100%]"
:title="t('login.btnRegister')"
@click="setLoginState(LoginStateEnum.REGISTER)"
/>
</el-col>
</el-row>
</el-form-item>
@ -103,32 +113,13 @@
<el-form-item>
<div class="flex justify-between w-[100%]">
<Icon
icon="ant-design:github-filled"
v-for="(item, key) in socialList"
:key="key"
:icon="item.icon"
:size="30"
class="cursor-pointer anticon"
color="#999"
@click="doSocialLogin('github')"
/>
<Icon
icon="ant-design:wechat-filled"
:size="30"
class="cursor-pointer anticon"
color="#999"
@click="doSocialLogin('wechat')"
/>
<Icon
icon="ant-design:alipay-circle-filled"
:size="30"
color="#999"
class="cursor-pointer anticon"
@click="doSocialLogin('alipay')"
/>
<Icon
icon="ant-design:dingtalk-circle-filled"
:size="30"
color="#999"
class="cursor-pointer anticon"
@click="doSocialLogin('dingtalk')"
@click="doSocialLogin(item.type)"
/>
</div>
</el-form-item>
@ -154,6 +145,7 @@ import { useRouter } from 'vue-router'
import type { RouteLocationNormalizedLoaded } from 'vue-router'
import { useI18n } from '@/hooks/web/useI18n'
import { useIcon } from '@/hooks/web/useIcon'
import { useMessage } from '@/hooks/web/useMessage'
import { required } from '@/utils/formRules'
import * as authUtil from '@/utils/auth'
import { decrypt } from '@/utils/jsencrypt'
@ -162,8 +154,13 @@ import { Verify } from '@/components/Verifition'
import { usePermissionStore } from '@/store/modules/permission'
import * as LoginApi from '@/api/login'
import { LoginStateEnum, useLoginState, useFormValid } from './useLogin'
import { XButton } from '@/components/XButton'
const { t } = useI18n()
const message = useMessage()
const iconHouse = useIcon({ icon: 'ep:house' })
const iconAvatar = useIcon({ icon: 'ep:avatar' })
const iconLock = useIcon({ icon: 'ep:lock' })
const formLogin = ref()
const { validForm } = useFormValid(formLogin)
const { setLoginState, getLoginState } = useLoginState()
@ -171,9 +168,6 @@ const { currentRoute, push } = useRouter()
const permissionStore = usePermissionStore()
const redirect = ref<string>('')
const loginLoading = ref(false)
const iconHouse = useIcon({ icon: 'ep:house' })
const iconAvatar = useIcon({ icon: 'ep:avatar' })
const iconLock = useIcon({ icon: 'ep:lock' })
const verify = ref()
const captchaType = ref('blockPuzzle') // blockPuzzle clickWord
@ -201,6 +195,25 @@ const loginData = reactive({
}
})
const socialList = [
{
icon: 'ant-design:github-filled',
type: 0
},
{
icon: 'ant-design:wechat-filled',
type: 30
},
{
icon: 'ant-design:alipay-circle-filled',
type: 0
},
{
icon: 'ant-design:dingtalk-circle-filled',
type: 20
}
]
//
const getCode = async () => {
//
@ -214,9 +227,11 @@ const getCode = async () => {
}
//ID
const getTenantId = async () => {
if (loginData.tenantEnable === 'true') {
const res = await LoginApi.getTenantIdByNameApi(loginData.loginForm.tenantName)
authUtil.setTenantId(res)
}
}
//
const getCookie = () => {
const username = authUtil.getUsername()
@ -279,8 +294,17 @@ const handleLogin = async (params) => {
}
//
const doSocialLogin = async (type: string) => {
const doSocialLogin = async (type: number) => {
if (type === 0) {
message.error('此方式未配置')
} else {
loginLoading.value = true
if (loginData.tenantEnable === 'true') {
await message.prompt('请输入租户名称', t('common.reminder')).then(async ({ value }) => {
const res = await LoginApi.getTenantIdByNameApi(value)
authUtil.setTenantId(res)
})
}
// redirectUri
const redirectUri =
location.origin + '/social-login?type=' + type + '&redirect=' + (redirect.value || '/')
@ -288,6 +312,7 @@ const doSocialLogin = async (type: string) => {
const res = await LoginApi.socialAuthRedirectApi(type, encodeURIComponent(redirectUri))
window.location.href = res
}
}
watch(
() => currentRoute.value,
(route: RouteLocationNormalizedLoaded) => {

View File

@ -53,10 +53,10 @@
<el-form-item prop="mobileCode">
<el-input v-model="loginForm.mobileCode" type="text" auto-complete="off" placeholder="短信验证码"
@keyup.enter.native="handleLogin">
<template slot="icon">
<template v-slot="icon">
<svg-icon slot="prefix" icon-class="password" class="el-input__icon input-icon"/>
</template>
<template slot="append">
<template v-slot="append">
<span v-if="mobileCodeTimer <= 0" class="getMobileCode" @click="getSmsCode" style="cursor: pointer;">获取验证码</span>
<span v-if="mobileCodeTimer > 0" class="getMobileCode">{{ mobileCodeTimer }}秒后可重新获取</span>
</template>
@ -115,6 +115,7 @@ import {
} from "@/utils/auth";
import Verify from '@/components/Verifition/Verify';
import {resetUserPwd} from "@/api/system/user";
export default {
name: "Login",
@ -254,9 +255,29 @@ export default {
}
});
},
doSocialLogin(socialTypeEnum) {
async doSocialLogin(socialTypeEnum) {
//
this.loading = true;
let tenant = false;
if (this.tenantEnable) {
await this.$prompt('请输入租户名称', "提示", {
confirmButtonText: "确定",
cancelButtonText: "取消"
}).then(({value}) => {
getTenantIdByName(value).then(res => {
const tenantId = res.data;
tenant = true
if (tenantId && tenantId >= 0) {
setTenantId(tenantId)
}
});
}).catch(() => {
return false
});
} else {
tenant = true
}
if(tenant){
// redirectUri
const redirectUri = location.origin + '/social-login?'
+ encodeURIComponent('type=' + socialTypeEnum.type + '&redirect=' + (this.redirect || "/")); //
@ -267,6 +288,7 @@ export default {
// console.log(res.url);
window.location.href = res.data;
});
}
},
/** ========== 以下为升级短信登录 ========== */
getSmsCode() {