ljydlv
/
sawAdmin
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

添加google登录及绑定

This commit is contained in:
junleea 2025-04-30 16:56:07 +08:00
parent 84981e7cc1
commit bf7d9b02d3
7 changed files with 103 additions and 33 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
package-lock.json generated
View File

@ -44,6 +44,7 @@
"xlsx": "^0.18.5"
},
"devDependencies": {
"@types/node": "^22.15.3",
"@vitejs/plugin-vue": "^3.0.0",
"@vue/compiler-sfc": "^3.1.2",
"typescript": "^4.6.4",
@ -920,6 +921,15 @@
"resolved": "https://registry.npmjs.org/@types/ms/-/ms-2.1.0.tgz",
"integrity": "sha512-GsCCIZDE/p3i96vtEqx+7dBUGXrc7zeSK3wwPHIaRThS+9OhWIXRqzs4d6k1SVU8g91DrNRWxWUGhp5KXQb2VA=="
},
"node_modules/@types/node": {
"version": "22.15.3",
"resolved": "https://registry.npmjs.org/@types/node/-/node-22.15.3.tgz",
"integrity": "sha512-lX7HFZeHf4QG/J7tBZqrCAXwz9J5RD56Y6MpP0eJkka8p+K0RY/yBTW7CYFJ4VGCclxqOLKmiGP5juQc6MKgcw==",
"dev": true,
"dependencies": {
"undici-types": "~6.21.0"
}
},
"node_modules/@types/trusted-types": {
"version": "2.0.7",
"resolved": "https://registry.npmjs.org/@types/trusted-types/-/trusted-types-2.0.7.tgz",
@ -5034,6 +5044,12 @@
"resolved": "https://registry.npmjs.org/ufo/-/ufo-1.5.4.tgz",
"integrity": "sha512-UsUk3byDzKd04EyoZ7U4DOlxQaD14JUKQl6/P7wiX4FNvUfm3XL246n9W5AmqwW5RSFJ27NAuM0iLscAOYUiGQ=="
},
"node_modules/undici-types": {
"version": "6.21.0",
"resolved": "https://registry.npmjs.org/undici-types/-/undici-types-6.21.0.tgz",
"integrity": "sha512-iwDZqg0QAGrg9Rav5H4n0M64c3mkR59cJ6wQp+7C4nI0gsmExaedaYLNO44eT4AtBBwjbTiGPMlt2Md0T9H9JQ==",
"dev": true
},
"node_modules/unimport": {
"version": "1.3.0",
"resolved": "https://registry.npmjs.org/unimport/-/unimport-1.3.0.tgz",

1
package.json
View File

@ -44,6 +44,7 @@
"xlsx": "^0.18.5"
},
"devDependencies": {
"@types/node": "^22.15.3",
"@vitejs/plugin-vue": "^3.0.0",
"@vue/compiler-sfc": "^3.1.2",
"typescript": "^4.6.4",

BIN
src/assets/img/google-logo.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.3 KiB

BIN
src/assets/img/google-logo_resized.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.5 KiB

81
src/views/pages/login.vue
View File

@ -55,31 +55,20 @@
<!-- 第三登录 -->
<el-divider content-position="center">第三方登录</el-divider>
<div class="login-text">
<el-row :gutter="20">
<el-col :span="8">
<el-button
type="primary"
class="github-btn"
@click="thirdLogin('github')"
circle
></el-button>
</el-col>
<el-col :span="8">
<el-button
type="primary"
class="gitee-btn"
@click="thirdLogin('gitee')"
circle
></el-button>
</el-col>
<el-col :span="8">
<el-button
type="primary"
class="qq-btn"
@click="thirdLogin('qq')"
circle
></el-button>
</el-col>
<el-row :gutter="12" >
<!-- thirdPartyLogoInfoList -->
<template v-for="(item, index) in thirdPartyLogoInfoList" :key="index">
<el-col :span="8">
<img :src="item.logo" alt="" @click="thirdLogin(item.name)" />
<!-- <el-button
class="github-btn"
@click="thirdLogin(item.name)"
circle
></el-button> -->
</el-col>
</template>
</el-row>
</div>
</div>
@ -134,6 +123,26 @@ const login = ref(null);
const maxLoginRepeatRequest = 30; //最大请求次数
const currentLoginRequest = ref(0); //当前请求次数
const thirdPartyLogoInfoList = ref([
{
name: "github",
logo: "https://www.ljsea.top/wp-content/uploads/2025/04/github-logo.png",
},
{
name: "gitee",
logo: "https://www.ljsea.top/wp-content/uploads/2025/04/gitee.png",
},
{
name: "qq",
logo: "https://wiki.connect.qq.com/wp-content/uploads/2016/12/Connect_logo_4.png",
},
{
name: "google",
logo: "https://www.ljsea.top/wp-content/uploads/2025/04/google-logo_resized.png",
},
]);
//表单数据
var loginData = ref({
username: "",
@ -141,6 +150,12 @@ var loginData = ref({
password: "",
ip: "",
});
const thirdPartyPlatform = ref([
{ label: 'QQ', value: 'qq' },
{ label: 'Github', value: 'github' },
{ label: 'Gitee', value: 'gitee' },
{ label: 'Google', value: 'google' },
]);
const thirdLogin = async (type) => {
//获取uuid
@ -155,10 +170,15 @@ const thirdLogin = async (type) => {
return;
}
let result={};
if(type !== "github" && type !== "qq" && type !== "gitee") {
ElMessage.error("不支持的登录平台！请稍后再试："+type);
return;
//平台
for(let i = 0; i < thirdPartyPlatform.value.length; i++) {
if (thirdPartyPlatform.value[i].value === type) {
break;
}
if (i === thirdPartyPlatform.value.length - 1) {
ElMessage.error("不支持的登录平台！请稍后再试："+type);
return;
}
}
result = await getThirdPartyLoginUrl({uuid: uuid,"type": "login", "platform": type });
if (result["code"] !== 0) {
@ -364,4 +384,7 @@ const getMyUserInfo = async (id) => {
background-image: url(https://wiki.connect.qq.com/wp-content/uploads/2016/12/Connect_logo_4.png);
}
.google-btn {
background-image: url(../../assets/img/google-logo_resized.png) !important;
}
</style>

26
src/views/pages/ucenter.vue
View File

@ -74,9 +74,14 @@
<el-tab-pane name="label5" label="第三方账号" class="user-tabpane">
<div>
<el-select v-model="activePlatformName" placeholder="请选择第三方平台" size="small" style="width: 200px;">
<el-option label="QQ" value="qq"></el-option>
<!-- <el-option label="QQ" value="qq"></el-option>
<el-option label="Github" value="github"></el-option>
<el-option label="gitee" value="gitee"></el-option>
<el-option label="google" value="google"></el-option> -->
<!-- thirdPartyPlatform -->
<template v-for="(item, index) in thirdPartyPlatform" :key="index">
<el-option :label="item.label" :value="item.value"></el-option>
</template>
</el-select>
<el-button type="primary" @click="thirdLogin(activePlatformName)">绑定</el-button>
</div>
@ -158,6 +163,13 @@ const currentLoginRequest = ref(0); //当前请求次数
const thirdPartyUserInfo = ref<ThirdPartyUserInfo[]>([]);
const thirdPartyPlatform = ref([
{ label: 'QQ', value: 'qq' },
{ label: 'Github', value: 'github' },
{ label: 'Gitee', value: 'gitee' },
{ label: 'Google', value: 'google' },
]);
const reset_password = () => {
localStorage.removeItem("ms_username");
@ -379,9 +391,15 @@ const thirdLogin = async (type) => {
return;
}
let result={};
if(type !== "github" && type !== "qq" && type !== "gitee") {
ElMessage.error("不支持的登录平台！请稍后再试："+type);
return;
//判断登录平台是否支持,thirdPartyPlatform
for(let i = 0; i < thirdPartyPlatform.value.length; i++) {
if (thirdPartyPlatform.value[i].value === type) {
break;
}
if (i === thirdPartyPlatform.value.length - 1) {
ElMessage.error("不支持的登录平台！请稍后再试："+type);
return;
}
}
result = await getThirdPartyLoginUrl({uuid: uuid,"type": "add", "platform": type, "token": localStorage.getItem("token") });
if (result["code"] !== 0) {

12
yarn.lock
View File

@ -600,6 +600,13 @@
resolved "https://registry.npmjs.org/@types/ms/-/ms-2.1.0.tgz"
integrity sha512-GsCCIZDE/p3i96vtEqx+7dBUGXrc7zeSK3wwPHIaRThS+9OhWIXRqzs4d6k1SVU8g91DrNRWxWUGhp5KXQb2VA==
"@types/node@^22.15.3", "@types/node@>= 14":
version "22.15.3"
resolved "https://registry.npmjs.org/@types/node/-/node-22.15.3.tgz"
integrity sha512-lX7HFZeHf4QG/J7tBZqrCAXwz9J5RD56Y6MpP0eJkka8p+K0RY/yBTW7CYFJ4VGCclxqOLKmiGP5juQc6MKgcw==
dependencies:
undici-types "~6.21.0"
"@types/trusted-types@^2.0.7":
version "2.0.7"
resolved "https://registry.npmjs.org/@types/trusted-types/-/trusted-types-2.0.7.tgz"
@ -3187,6 +3194,11 @@ ufo@^1.5.4:
resolved "https://registry.npmjs.org/ufo/-/ufo-1.5.4.tgz"
integrity sha512-UsUk3byDzKd04EyoZ7U4DOlxQaD14JUKQl6/P7wiX4FNvUfm3XL246n9W5AmqwW5RSFJ27NAuM0iLscAOYUiGQ==
undici-types@~6.21.0:
version "6.21.0"
resolved "https://registry.npmjs.org/undici-types/-/undici-types-6.21.0.tgz"
integrity sha512-iwDZqg0QAGrg9Rav5H4n0M64c3mkR59cJ6wQp+7C4nI0gsmExaedaYLNO44eT4AtBBwjbTiGPMlt2Md0T9H9JQ==
unimport@^1.0.1:
version "1.3.0"
resolved "https://registry.npmjs.org/unimport/-/unimport-1.3.0.tgz"