【新增】AI：聊天对话的删除功能

83b93321 · YunaiV · 3d83f492 · 83b93321 · 83b93321
Commit 83b93321 authored May 15, 2024 by YunaiV
Hide whitespace changes
Inline Side-by-side

Showing with 26 additions and 31 deletions

src/api/ai/chat/conversation/index.ts
+10 -3

src/views/ai/chat/index.vue
+16 -28

No files found.
--- a/src/api/ai/chat/conversation/index.ts
+++ b/src/api/ai/chat/conversation/index.ts
@@ -13,6 +13,7 @@ export interface ChatConversationVO {
  maxTokens: number // 单条回复的最大 Token 数量
  maxContexts: number // 上下文的最大 Message 数量
  // 额外字段
+  modelName?: string // 模型名字
  roleAvatar?: string // 角色头像
  modelMaxTokens?: string // 模型的单条回复的最大 Token 数量
  modelMaxContexts?: string // 模型的上下文的最大 Message 数量
@@ -24,14 +25,20 @@ export const ChatConversationApi = {
  getChatConversationMy: async (id: number) => {
    return await request.get({ url: `/ai/chat/conversation/get-my?id=${id}` })
  },
+  // 新增【我的】聊天会话
+  createChatConversationMy: async (data?: ChatConversationVO) => {
+    return await request.post({ url: `/ai/chat/conversation/create-my`, data })
+  },
  // 更新【我的】聊天会话
  updateChatConversationMy: async (data: ChatConversationVO) => {
    return await request.put({ url: `/ai/chat/conversation/update-my`, data })
  },
-  // 新增【我的】聊天会话
+  // 删除【我的】聊天会话
-  createChatConversationMy: async (data?: ChatConversationVO) => {
+  deleteChatConversationMy: async (id: number) => {
-    return await request.post({ url: `/ai/chat/conversation/create-my`, data })
+    return await request.delete({ url: `/ai/chat/conversation/delete-my?id=${id}` })
  },
  // 获得【我的】聊天会话列表

--- a/src/views/ai/chat/index.vue
+++ b/src/views/ai/chat/index.vue
@@ -22,7 +22,7 @@
        </el-input>
        <!-- 左中间：对话列表 -->
        <div class="conversation-list">
-          <!-- TODO @芋艿，置顶、聊天记录、一星期钱、30天前，前端对数据重新做一下分组，或者后端接口改一下 -->
+          <!-- TODO @fain：置顶、聊天记录、一星期钱、30天前，前端对数据重新做一下分组，或者后端接口改一下 -->
          <div>
            <el-text class="mx-1" size="small" tag="b">置顶</el-text>
          </div>
@@ -35,11 +35,12 @@
                <img class="avatar" :src="conversation.roleAvatar" />
                <span class="title">{{ conversation.title }}</span>
              </div>
+              <!-- TODO @fan：缺一个【置顶】按钮，效果改成 hover 上去展示 -->
              <div class="button-wrapper">
                <el-icon title="编辑" @click="updateConversationTitle(conversation)">
                  <Icon icon="ep:edit" />
                </el-icon>
-                <el-icon title="删除会话" @click="deleteConversationTitle(conversation)">
+                <el-icon title="删除会话" @click="deleteChatConversation(conversation)">
                  <Icon icon="ep:delete" />
                </el-icon>
              </div>
@@ -69,7 +70,7 @@
        <div>
          <!-- TODO @fan：样式改下；这里我已经改成点击后，弹出了 -->
          <el-button type="primary" @click="openChatConversationUpdateForm">
-            <span v-html="useModal?.name"></span>
+            <span v-html="useConversation?.modelName"></span>
            <Icon icon="ep:setting" style="margin-left: 10px" />
          </el-button>
          <el-button>
@@ -190,7 +191,6 @@
 import { ChatMessageApi, ChatMessageSendVO, ChatMessageVO } from '@/api/ai/chat/message'
 import { ChatConversationApi, ChatConversationVO } from '@/api/ai/chat/conversation'
 import ChatConversationUpdateForm from './components/ChatConversationUpdateForm.vue'
-import { ChatModelApi, ChatModelVO } from '@/api/ai/model/chatModel'
 import { formatDate } from '@/utils/formatTime'
 import { useClipboard } from '@vueuse/core'
 // 转换 markdown
@@ -199,7 +199,6 @@ import { marked } from 'marked'
 import 'highlight.js/styles/vs2015.min.css'
 import hljs from 'highlight.js'
-const { t } = useI18n() // 国际化
 const message = useMessage() // 消息弹窗
 // 自定义渲染器
@@ -221,8 +220,7 @@ const { copy } = useClipboard()
 const searchName = ref('') // 查询的内容
 const inputTimeout = ref<any>() // 处理输入中回车的定时器
 const conversationId = ref(0) // 选中的对话编号
-const conversationInProgress = ref<Boolean>() // 对话进行中
+const conversationInProgress = ref(false) // 对话进行中
-conversationInProgress.value = false
 const conversationInAbortController = ref<any>() // 对话进行中 abort 控制器(控制 stream 对话)
 const prompt = ref<string>() // prompt
@@ -235,9 +233,7 @@ const isComposing = ref(false) // 判断用户是否在输入
 /** chat message 列表 */
 // defineOptions({ name: 'chatMessageList' })
 const list = ref<ChatMessageVO[]>([]) // 列表的数据
-const useModal = ref<ChatModelVO>() // 使用的modal
 const useConversation = ref<ChatConversationVO>() // 使用的 Conversation
-const modalList = ref<ChatModelVO[]>([]) // 列表的数据
 /** 新建对话 */
 const createConversation = async () => {
@@ -274,13 +270,20 @@ const updateConversationTitle = async (conversation: ChatConversationVO) => {
 }
 /** 删除聊天会话 */
-const deleteConversationTitle = async (conversation: ChatConversationVO) => {
+const deleteChatConversation = async (conversation: ChatConversationVO) => {
-  console.log(conversation)
+  try {
-  // TODO 芋艿：待实现
+    // 删除的二次确认
+    await message.delConfirm(`是否确认删除会话 - ${conversation.title}?`)
+    // 发起删除
+    await ChatConversationApi.deleteChatConversationMy(conversation.id)
+    message.success('会话已删除')
+    // 刷新列表
+    await getChatConversationList()
+  } catch {}
 }
 const searchConversation = () => {
-  // TODO 芋艿：待实现
+  // TODO fan：待实现
 }
 /** send */
@@ -456,11 +459,6 @@ const openChatConversationUpdateForm = async () => {
  chatConversationUpdateFormRef.value.open(conversationId.value)
 }
-const getModalList = async () => {
-  // 获取模型  as unknown as ChatModelVO
-  modalList.value = (await ChatModelApi.getChatModelSimpleList(0)) as unknown as ChatModelVO[]
-}
 // 输入
 const onCompositionstart = () => {
  console.log('onCompositionstart。。。.')
@@ -500,14 +498,6 @@ const getConversation = async (conversationId: string) => {
  // 获取对话信息
  useConversation.value = await ChatConversationApi.getChatConversationMy(conversationId)
  console.log('useConversation.value', useConversation.value)
-  // 选中 modal
-  if (useConversation.value) {
-    modalList.value.forEach((item) => {
-      if (useConversation.value?.modelId === item.id) {
-        useModal.value = item
-      }
-    })
-  }
 }
 /** 获得聊天会话列表 */
@@ -529,8 +519,6 @@ const getChatConversationList = async () => {
 onMounted(async () => {
  // 获得聊天会话列表
  await getChatConversationList()
-  // 获取模型
-  getModalList()
  // 获取对话信息
  getConversation(conversationId.value)
  // 获取列表数据