瀏覽代碼

【解决todo】AI Chat 转换用户头像、role头像

cherishsince 1 年之前
父節點
當前提交
431ae7b01b
共有 3 個文件被更改,包括 13 次插入9 次删除
  1. 2 0
      src/api/ai/chat/message/index.ts
  2. 2 6
      src/views/ai/chat/Message.vue
  3. 9 3
      src/views/ai/chat/index.vue

+ 2 - 0
src/api/ai/chat/message/index.ts

@@ -15,6 +15,8 @@ export interface ChatMessageVO {
   content: string // 聊天内容
   tokens: number // 消耗 Token 数量
   createTime: Date // 创建时间
+  roleAvatar: string // 角色头像
+  userAvatar: string // 创建时间
 }
 
 export interface ChatMessageSendVO {

+ 2 - 6
src/views/ai/chat/Message.vue

@@ -5,9 +5,7 @@
       <!-- TODO 芋艿:类型判断 -->
       <div class="left-message message-item" v-if="item.type !== 'user'">
         <div class="avatar">
-          <el-avatar
-            src="https://cube.elemecdn.com/0/88/03b0d39583f48206768a7534e55bcpng.png"
-          />
+          <el-avatar :src="item.roleAvatar" />
         </div>
         <div class="message">
           <div>
@@ -29,9 +27,7 @@
       <!--  靠右 message  -->
       <div class="right-message message-item" v-if="item.type === 'user'">
         <div class="avatar">
-          <el-avatar
-            src="https://cube.elemecdn.com/0/88/03b0d39583f48206768a7534e55bcpng.png"
-          />
+          <el-avatar :src="item.userAvatar" />
         </div>
         <div class="message">
           <div>

+ 9 - 3
src/views/ai/chat/index.vue

@@ -93,6 +93,7 @@ import ChatEmpty from './ChatEmpty.vue'
 import MessageLoading from './MessageLoading.vue'
 import {ChatMessageApi, ChatMessageVO} from '@/api/ai/chat/message'
 import {ChatConversationApi, ChatConversationVO} from '@/api/ai/chat/conversation'
+import { getUserProfile, ProfileVO } from '@/api/system/user/profile'
 import {useClipboard} from '@vueuse/core'
 import ChatConversationUpdateForm from "@/views/ai/chat/components/ChatConversationUpdateForm.vue";
 import {Download, Top} from "@element-plus/icons-vue";
@@ -385,7 +386,14 @@ const getMessageList = async () => {
       return
     }
     // 获取列表数据
-    list.value = await ChatMessageApi.messageList(activeConversationId.value)
+    const messageListRes = await ChatMessageApi.messageList(activeConversationId.value)
+    // 设置用户头像
+    const user = await getUserProfile()
+    messageListRes.map(item => {
+      item.userAvatar = user?.avatar
+    })
+    list.value = messageListRes
+    console.log("设置头像成功", messageListRes)
     // 滚动到最下面
     await nextTick(() => {
       // 滚动到最后
@@ -505,8 +513,6 @@ const handlerMessageClear = async () => {
   await getMessageList()
 }
 
-
-
 /** 初始化 **/
 onMounted(async () => {
   // 设置当前对话 TODO 角色仓库过来的,自带 conversationId 需要选中