refactor: profile
xingyu4j
4 years ago
parent
fab2366d55
commit
770bf45f01
@ -0,0 +1,77 @@
|
|||||||
|
import request from '@/config/axios'
|
||||||
|
|
||||||
|
export interface ProfileDept {
|
||||||
|
id: number
|
||||||
|
name: string
|
||||||
|
}
|
||||||
|
export interface ProfileRole {
|
||||||
|
id: number
|
||||||
|
name: string
|
||||||
|
}
|
||||||
|
export interface ProfilePost {
|
||||||
|
id: number
|
||||||
|
name: string
|
||||||
|
}
|
||||||
|
export interface SocialUser {
|
||||||
|
id: number
|
||||||
|
type: number
|
||||||
|
openid: string
|
||||||
|
token: string
|
||||||
|
rawTokenInfo: string
|
||||||
|
nickname: string
|
||||||
|
avatar: string
|
||||||
|
rawUserInfo: string
|
||||||
|
code: string
|
||||||
|
state: string
|
||||||
|
}
|
||||||
|
export interface ProfileVO {
|
||||||
|
id: number
|
||||||
|
username: string
|
||||||
|
nickname: string
|
||||||
|
dept: ProfileDept
|
||||||
|
roles: ProfileRole[]
|
||||||
|
posts: ProfilePost[]
|
||||||
|
socialUsers: SocialUser[]
|
||||||
|
email: string
|
||||||
|
mobile: string
|
||||||
|
sex: number
|
||||||
|
avatar: string
|
||||||
|
status: number
|
||||||
|
remark: string
|
||||||
|
loginIp: string
|
||||||
|
loginDate: Date
|
||||||
|
createTime: Date
|
||||||
|
}
|
||||||
|
|
||||||
|
export interface UserProfileUpdateReqVO {
|
||||||
|
nickname: string
|
||||||
|
email: string
|
||||||
|
mobile: string
|
||||||
|
sex: number
|
||||||
|
}
|
||||||
|
|
||||||
|
// 查询用户个人信息
|
||||||
|
export const getUserProfileApi = () => {
|
||||||
|
return request.get({ url: '/system/user/profile/get' })
|
||||||
|
}
|
||||||
|
|
||||||
|
// 修改用户个人信息
|
||||||
|
export const updateUserProfileApi = (data: UserProfileUpdateReqVO) => {
|
||||||
|
return request.put({ url: '/system/user/profile/update', data })
|
||||||
|
}
|
||||||
|
|
||||||
|
// 用户密码重置
|
||||||
|
export const updateUserPwdApi = (oldPassword: string, newPassword: string) => {
|
||||||
|
return request.put({
|
||||||
|
url: '/system/user/profile/update-password',
|
||||||
|
data: {
|
||||||
|
oldPassword: oldPassword,
|
||||||
|
newPassword: newPassword
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// 用户头像上传
|
||||||
|
export const uploadAvatarApi = (data) => {
|
||||||
|
return request.upload({ url: '/system/user/profile/update-avatar', data: data })
|
||||||
|
}
|
||||||
@ -1,27 +0,0 @@
|
|||||||
import request from '@/config/axios'
|
|
||||||
|
|
||||||
// 查询用户个人信息
|
|
||||||
export const getUserProfileApi = () => {
|
|
||||||
return request.get({ url: '/system/user/profile/get' })
|
|
||||||
}
|
|
||||||
|
|
||||||
// 修改用户个人信息
|
|
||||||
export const updateUserProfileApi = (params) => {
|
|
||||||
return request.put({ url: '/system/user/profile/update', params })
|
|
||||||
}
|
|
||||||
|
|
||||||
// 用户密码重置
|
|
||||||
export const updateUserPwdApi = (oldPassword: string, newPassword: string) => {
|
|
||||||
return request.put({
|
|
||||||
url: '/system/user/profile/update-password',
|
|
||||||
data: {
|
|
||||||
oldPassword: oldPassword,
|
|
||||||
newPassword: newPassword
|
|
||||||
}
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
// 用户头像上传
|
|
||||||
export const uploadAvatarApi = (data) => {
|
|
||||||
return request.upload({ url: '/system/user/profile/update-avatar', data: data })
|
|
||||||
}
|
|
||||||
@ -1,42 +0,0 @@
|
|||||||
export type ProfileDept = {
|
|
||||||
id: number
|
|
||||||
name: string
|
|
||||||
}
|
|
||||||
export type ProfileRole = {
|
|
||||||
id: number
|
|
||||||
name: string
|
|
||||||
}
|
|
||||||
export type ProfilePost = {
|
|
||||||
id: number
|
|
||||||
name: string
|
|
||||||
}
|
|
||||||
export type SocialUser = {
|
|
||||||
id: number
|
|
||||||
type: number
|
|
||||||
openid: string
|
|
||||||
token: string
|
|
||||||
rawTokenInfo: string
|
|
||||||
nickname: string
|
|
||||||
avatar: string
|
|
||||||
rawUserInfo: string
|
|
||||||
code: string
|
|
||||||
state: string
|
|
||||||
}
|
|
||||||
export type ProfileVO = {
|
|
||||||
id: number
|
|
||||||
username: string
|
|
||||||
nickname: string
|
|
||||||
dept: ProfileDept
|
|
||||||
roles: ProfileRole[]
|
|
||||||
posts: ProfilePost[]
|
|
||||||
socialUsers: SocialUser[]
|
|
||||||
email: string
|
|
||||||
mobile: string
|
|
||||||
sex: number
|
|
||||||
avatar: string
|
|
||||||
status: number
|
|
||||||
remark: string
|
|
||||||
loginIp: string
|
|
||||||
loginDate: Date
|
|
||||||
createTime: Date
|
|
||||||
}
|
|
||||||
@ -0,0 +1,31 @@
|
|||||||
|
import request from '@/config/axios'
|
||||||
|
|
||||||
|
// 社交绑定，使用 code 授权码
|
||||||
|
export const socialBind = (type, code, state) => {
|
||||||
|
return request.post({
|
||||||
|
url: '/system/social-user/bind',
|
||||||
|
data: {
|
||||||
|
type,
|
||||||
|
code,
|
||||||
|
state
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// 取消社交绑定
|
||||||
|
export const socialUnbind = (type, openid) => {
|
||||||
|
return request.delete({
|
||||||
|
url: '/system/social-user/unbind',
|
||||||
|
data: {
|
||||||
|
type,
|
||||||
|
openid
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// 社交授权的跳转
|
||||||
|
export const socialAuthRedirect = (type, redirectUri) => {
|
||||||
|
return request.get({
|
||||||
|
url: '/system/auth/social-auth-redirect?type=' + type + '&redirectUri=' + redirectUri
|
||||||
|
})
|
||||||
|
}
|
||||||
@ -1,54 +1,70 @@
|
|||||||
<script setup lang="ts">
|
|
||||||
import { ElTable, ElTableColumn } from 'element-plus'
|
|
||||||
import { onMounted, reactive } from 'vue'
|
|
||||||
interface sociaType {
|
|
||||||
title: string
|
|
||||||
type: string
|
|
||||||
source: string
|
|
||||||
img: string
|
|
||||||
}
|
|
||||||
interface socialUserType {
|
|
||||||
socialUser: {
|
|
||||||
socia: sociaType[]
|
|
||||||
}
|
|
||||||
}
|
|
||||||
const state = reactive<socialUserType>({
|
|
||||||
socialUser: {
|
|
||||||
socia: []
|
|
||||||
}
|
|
||||||
})
|
|
||||||
const initSocial = () => {
|
|
||||||
console.info(1)
|
|
||||||
}
|
|
||||||
const bind = () => {
|
|
||||||
console.info(1)
|
|
||||||
}
|
|
||||||
const unbind = () => {
|
|
||||||
console.info(1)
|
|
||||||
}
|
|
||||||
onMounted(async () => {
|
|
||||||
await initSocial()
|
|
||||||
})
|
|
||||||
</script>
|
|
||||||
<template>
|
<template>
|
||||||
<el-table :data="state.socialUser.socia" :show-header="false">
|
<el-table :data="socialUsers" :show-header="false">
|
||||||
<el-table-column label="社交平台" align="left" width="120" prop="socia">
|
<el-table-column type="seq" title="序号" width="60" fixed="left" />
|
||||||
<template #socia="{ row }">
|
<el-table-column label="社交平台" align="left" width="120">
|
||||||
|
<template #default="{ row }">
|
||||||
<img style="height: 20px; vertical-align: middle" :src="row.img" alt="" />
|
<img style="height: 20px; vertical-align: middle" :src="row.img" alt="" />
|
||||||
{{ row.title }}
|
{{ row.title }}
|
||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
<el-table-column label="操作" align="left" prop="action">
|
<el-table-column label="操作" align="center">
|
||||||
<template #action="{ row }">
|
<template #default="{ row }">
|
||||||
<div v-if="row.openid">
|
<template v-if="row.openid">
|
||||||
已绑定
|
已绑定
|
||||||
<el-button link type="primary" @click="unbind()">(解绑)</el-button>
|
<XTextButton type="primary" @click="unbind(row)" title="(解绑)" />
|
||||||
</div>
|
</template>
|
||||||
<div v-else>
|
<template v-else>
|
||||||
未绑定
|
未绑定
|
||||||
<el-button link type="primary" @click="bind()">(绑定)</el-button>
|
<XTextButton type="primary" @click="bind(row)" title="(绑定)" />
|
||||||
</div>
|
</template>
|
||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
</el-table>
|
</el-table>
|
||||||
</template>
|
</template>
|
||||||
|
<script setup lang="ts">
|
||||||
|
import { onMounted, ref } from 'vue'
|
||||||
|
import { ElTable, ElTableColumn } from 'element-plus'
|
||||||
|
import { SystemUserSocialTypeEnum } from '@/utils/constants'
|
||||||
|
import { getUserProfileApi, ProfileVO } from '@/api/system/user/profile'
|
||||||
|
import { socialAuthRedirect, socialUnbind } from '@/api/system/user/socialUser'
|
||||||
|
import { ElMessage } from 'element-plus'
|
||||||
|
|
||||||
|
const socialUsers = ref<any[]>([])
|
||||||
|
const userInfo = ref<ProfileVO>()
|
||||||
|
const initSocial = async () => {
|
||||||
|
const res = await getUserProfileApi()
|
||||||
|
userInfo.value = res
|
||||||
|
for (const i in SystemUserSocialTypeEnum) {
|
||||||
|
const socialUser = { ...SystemUserSocialTypeEnum[i] }
|
||||||
|
socialUsers.value.push(socialUser)
|
||||||
|
if (userInfo.value?.socialUsers) {
|
||||||
|
for (const j in userInfo.value.socialUsers) {
|
||||||
|
if (socialUser.type === userInfo.value.socialUsers[j].type) {
|
||||||
|
socialUser.openid = userInfo.value.socialUsers[j].openid
|
||||||
|
break
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
console.info(socialUsers.value)
|
||||||
|
}
|
||||||
|
const bind = (row) => {
|
||||||
|
const redirectUri = location.origin + '/user/profile?type=' + row.type
|
||||||
|
// 进行跳转
|
||||||
|
socialAuthRedirect(row.type, encodeURIComponent(redirectUri)).then((res) => {
|
||||||
|
console.log(res.url)
|
||||||
|
window.location.href = res.data
|
||||||
|
})
|
||||||
|
}
|
||||||
|
const unbind = async (row) => {
|
||||||
|
const res = await socialUnbind(row.type, row.openid)
|
||||||
|
if (res) {
|
||||||
|
row.openid = undefined
|
||||||
|
}
|
||||||
|
ElMessage.success('解绑成功')
|
||||||
|
}
|
||||||
|
|
||||||
|
onMounted(async () => {
|
||||||
|
await initSocial()
|
||||||
|
})
|
||||||
|
</script>
|
||||||
|
|||||||
Loading…
Reference in New Issue