refactor: chat left menu avatar
This commit is contained in:
parent
bdba507090
commit
4c66fa998f
@ -42,6 +42,10 @@ const open: (loading?: Ref<boolean>) => Promise<Result<string>> = (loading) => {
|
|||||||
const chat: (chat_id: string, data: any) => Promise<any> = (chat_id, data) => {
|
const chat: (chat_id: string, data: any) => Promise<any> = (chat_id, data) => {
|
||||||
return postStream(`/chat/api/chat_message/${chat_id}`, data)
|
return postStream(`/chat/api/chat_message/${chat_id}`, data)
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 应用认证信息
|
||||||
|
*/
|
||||||
const chatProfile: (assessToken: string, loading?: Ref<boolean>) => Promise<Result<ChatProfile>> = (
|
const chatProfile: (assessToken: string, loading?: Ref<boolean>) => Promise<Result<ChatProfile>> = (
|
||||||
assessToken,
|
assessToken,
|
||||||
loading,
|
loading,
|
||||||
@ -219,6 +223,13 @@ const resetCurrentPassword: (
|
|||||||
) => Promise<Result<boolean>> = (request, loading) => {
|
) => Promise<Result<boolean>> = (request, loading) => {
|
||||||
return post('/chat_user/current/reset_password', request, undefined, loading)
|
return post('/chat_user/current/reset_password', request, undefined, loading)
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 获取当前用户信息
|
||||||
|
*/
|
||||||
|
const getChatUserProfile: (loading?: Ref<boolean>) => Promise<Result<any>> = (loading) => {
|
||||||
|
return get('/chat_user/profile', {}, loading)
|
||||||
|
}
|
||||||
export default {
|
export default {
|
||||||
open,
|
open,
|
||||||
chat,
|
chat,
|
||||||
@ -240,5 +251,6 @@ export default {
|
|||||||
pageChat,
|
pageChat,
|
||||||
pageChatRecord,
|
pageChatRecord,
|
||||||
logout,
|
logout,
|
||||||
resetCurrentPassword
|
resetCurrentPassword,
|
||||||
|
getChatUserProfile
|
||||||
}
|
}
|
||||||
|
|||||||
@ -12,4 +12,12 @@ interface ChatProfile {
|
|||||||
// 登录类型
|
// 登录类型
|
||||||
login_value?: Array<string>
|
login_value?: Array<string>
|
||||||
}
|
}
|
||||||
export { type ChatProfile }
|
|
||||||
|
interface ChatUserProfile {
|
||||||
|
email: string
|
||||||
|
id: string
|
||||||
|
nick_name: string
|
||||||
|
username: string
|
||||||
|
source: string
|
||||||
|
}
|
||||||
|
export { type ChatProfile, type ChatUserProfile }
|
||||||
|
|||||||
@ -59,6 +59,7 @@ router.beforeEach(
|
|||||||
} else {
|
} else {
|
||||||
try {
|
try {
|
||||||
await chatUser.applicationProfile()
|
await chatUser.applicationProfile()
|
||||||
|
await chatUser.getChatUserProfile()
|
||||||
} catch (e: any) {
|
} catch (e: any) {
|
||||||
if (e.response?.status === 401) {
|
if (e.response?.status === 401) {
|
||||||
next({
|
next({
|
||||||
|
|||||||
@ -1,6 +1,6 @@
|
|||||||
import { defineStore } from 'pinia'
|
import { defineStore } from 'pinia'
|
||||||
import ChatAPI from '@/api/chat/chat'
|
import ChatAPI from '@/api/chat/chat'
|
||||||
import { type ChatProfile } from '@/api/type/chat'
|
import type { ChatProfile, ChatUserProfile } from '@/api/type/chat'
|
||||||
import type { LoginRequest } from '@/api/type/user'
|
import type { LoginRequest } from '@/api/type/user'
|
||||||
import type { Ref } from 'vue'
|
import type { Ref } from 'vue'
|
||||||
interface ChatUser {
|
interface ChatUser {
|
||||||
@ -11,6 +11,7 @@ interface Application {}
|
|||||||
interface Chat {
|
interface Chat {
|
||||||
chat_profile?: ChatProfile
|
chat_profile?: ChatProfile
|
||||||
application?: Application
|
application?: Application
|
||||||
|
chatUserProfile?: ChatUserProfile
|
||||||
token?: string
|
token?: string
|
||||||
accessToken?: string
|
accessToken?: string
|
||||||
}
|
}
|
||||||
@ -30,6 +31,10 @@ const useChatUserStore = defineStore('chat-user', {
|
|||||||
return this.chat_profile
|
return this.chat_profile
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
|
async getChatUserProfile() {
|
||||||
|
const res = await ChatAPI.getChatUserProfile()
|
||||||
|
this.chatUserProfile = res.data
|
||||||
|
},
|
||||||
applicationProfile() {
|
applicationProfile() {
|
||||||
return ChatAPI.applicationProfile().then((ok) => {
|
return ChatAPI.applicationProfile().then((ok) => {
|
||||||
this.application = ok.data
|
this.application = ok.data
|
||||||
|
|||||||
@ -135,34 +135,38 @@
|
|||||||
<el-text type="info">{{ $t('chat.noHistory') }}</el-text>
|
<el-text type="info">{{ $t('chat.noHistory') }}</el-text>
|
||||||
</div>
|
</div>
|
||||||
</el-sub-menu>
|
</el-sub-menu>
|
||||||
<el-dropdown trigger="click" type="primary" class="w-full">
|
|
||||||
|
<div v-if="!chatUser.chat_profile?.authentication" class="no-auth-avatar">
|
||||||
|
<el-avatar :size="32">
|
||||||
|
<img src="@/assets/user-icon.svg" style="width: 54%" alt="" />
|
||||||
|
</el-avatar>
|
||||||
|
</div>
|
||||||
|
<el-dropdown v-else trigger="click" type="primary" class="w-full">
|
||||||
<div class="flex align-center user-info">
|
<div class="flex align-center user-info">
|
||||||
<el-avatar :size="32">
|
<el-avatar :size="32">
|
||||||
<img src="@/assets/user-icon.svg" style="width: 54%" alt="" />
|
<img src="@/assets/user-icon.svg" style="width: 54%" alt="" />
|
||||||
</el-avatar>
|
</el-avatar>
|
||||||
<!-- TODO -->
|
<span v-show="!isPcCollapse" class="ml-8 color-text-primary">{{ chatUser.chatUserProfile?.nick_name }}</span>
|
||||||
<span v-show="!isPcCollapse" class="ml-8 color-text-primary">{{ 222 }}</span>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<template #dropdown>
|
<template #dropdown>
|
||||||
<el-dropdown-menu class="avatar-dropdown">
|
<el-dropdown-menu class="avatar-dropdown">
|
||||||
<div class="flex align-center" style="padding: 12px;">
|
<div class="flex align-center" style="padding: 8px 12px;">
|
||||||
<div class="mr-8 flex align-center">
|
<div class="mr-8 flex align-center">
|
||||||
<el-avatar :size="40">
|
<el-avatar :size="40">
|
||||||
<img src="@/assets/user-icon.svg" style="width: 54%" alt="" />
|
<img src="@/assets/user-icon.svg" style="width: 54%" alt="" />
|
||||||
</el-avatar>
|
</el-avatar>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<!-- TODO -->
|
<h4 class="medium mb-4">{{ chatUser.chatUserProfile?.nick_name }}</h4>
|
||||||
<h4 class="medium mb-4">{{ 111 }}</h4>
|
<div class="color-secondary">{{ `${t('common.username')}: ${chatUser.chatUserProfile?.username}` }}</div>
|
||||||
<div class="color-secondary">{{ `${t('common.username')}: 222` }}</div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<el-dropdown-item class="border-t" style="padding-top: 8px; padding-bottom: 8px;" @click="openResetPassword">
|
<el-dropdown-item v-if="chatUser.chatUserProfile?.source === 'LOCAL'" class="border-t" style="padding-top: 8px; padding-bottom: 8px;" @click="openResetPassword">
|
||||||
<AppIcon iconName="app-export" />
|
<AppIcon iconName="app-export" />
|
||||||
{{ $t('views.login.resetPassword') }}
|
{{ $t('views.login.resetPassword') }}
|
||||||
</el-dropdown-item>
|
</el-dropdown-item>
|
||||||
<el-dropdown-item class="border-t" @click="logout">
|
<el-dropdown-item v-if="chatUser.chatUserProfile?.source === 'LOCAL'" class="border-t" style="padding-top: 8px; padding-bottom: 8px;" @click="logout">
|
||||||
<AppIcon iconName="app-export" />
|
<AppIcon iconName="app-export" />
|
||||||
{{ $t('layout.logout') }}
|
{{ $t('layout.logout') }}
|
||||||
</el-dropdown-item>
|
</el-dropdown-item>
|
||||||
@ -545,6 +549,14 @@ onMounted(() => {
|
|||||||
background: transparent;
|
background: transparent;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.no-auth-avatar {
|
||||||
|
margin-top: auto;
|
||||||
|
padding: 16px;
|
||||||
|
.el-avatar {
|
||||||
|
cursor: default;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
.el-dropdown {
|
.el-dropdown {
|
||||||
margin-top: auto;
|
margin-top: auto;
|
||||||
.user-info {
|
.user-info {
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user