feat: 完成大部分功能开发

web/src/views/ChatLLMView.vue

@@ -4,6 +4,7 @@ import type { Message } from "@/interfaces";
 import { throttle } from "lodash-es";
 import AIAvatar from "@/assets/ai_avatar.png";
 import {
+  DocumentDuplicateIcon,
   ExclamationTriangleIcon,
   microphone,
   PaperAirplaneIcon,
@@ -12,6 +13,7 @@ import {
 import UserAvatar from "@/assets/user_avatar.jpg";
 import markdown from "@/components/markdown.vue";
 import { useAsrStore, useChatStore, useLayoutStore } from "@/stores";
+import { copy } from "@/utils";
 
 const chatStore = useChatStore();
 const { historyMessages, completing, modelList, modelInfo, thinking } =
@@ -29,6 +31,11 @@ const collapseActive = ref<string[]>(
   historyMessages.value.map((msg, idx) => String(msg.id ?? idx))
 );
 
+// 过滤出type为chat的聊天消息
+const filteredMessages = computed(() =>
+  historyMessages.value.filter((msg) => msg.type === "chat" || !msg.type)
+);
+
 const getName = (msg: Message, idx: number) => String(msg.id ?? idx);
 
 // TODO: bugfix: 未能正确展开
@@ -148,7 +155,7 @@ onMounted(() => {
       </div>
       <!-- 默认消息↑ 历史消息↓ -->
       <div
-        v-for="(msg, idx) in historyMessages"
+        v-for="(msg, idx) in filteredMessages"
         :key="idx"
         class="flex items-start mb-4"
       >
@@ -199,8 +206,18 @@ onMounted(() => {
             </NCollapse>
             <!-- 内容↓ 思维链↑ -->
             <markdown :content="msg.content || ''" />
-            <div v-if="msg.role !== 'user'" class="mt-2">
-              <tts :text="msg.content || ''" :message-id="msg.id!" />
+            <div class="flex items-center gap-2 justify-end mt-2">
+              <div v-if="msg.role !== 'user'">
+                <tts :text="msg.content || ''" :message-id="msg.id!" />
+              </div>
+              <NPopover trigger="hover">
+                <template #trigger>
+                  <NButton quaternary circle @click="copy(msg.content || '')">
+                    <DocumentDuplicateIcon class="!w-4 !h-4" />
+                  </NButton>
+                </template>
+                <span>复制内容</span>
+              </NPopover>
             </div>
             <NDivider />
           </div>
@@ -241,7 +258,7 @@ onMounted(() => {
           :positive-button-props="{ type: 'error' }"
           positive-text="清除"
           negative-text="取消"
-          @positive-click="chatStore.clearHistoryMessages"
+          @positive-click="chatStore.clearHistoryMessages('chat')"
           @negative-click="() => {}"
         >
           <template #icon>

web/src/views/VoiceView.vue

@@ -23,6 +23,11 @@ const collapseActive = ref<string[]>(
   historyMessages.value.map((msg, idx) => String(msg.id ?? idx))
 );
 
+// 过滤出type为voice的聊天消息
+const filteredMessages = computed(() =>
+  historyMessages.value.filter((msg) => msg.type === "voice")
+);
+
 const getName = (msg: Message, idx: number) => String(msg.id ?? idx);
 
 // TODO: bugfix: 未能正确展开
@@ -135,7 +140,7 @@ onMounted(() => {
       </div>
       <!-- 默认消息↑ 历史消息↓ -->
       <div
-        v-for="(msg, idx) in historyMessages"
+        v-for="(msg, idx) in filteredMessages"
         :key="idx"
         class="flex items-start mb-4"
       >
@@ -217,7 +222,7 @@ onMounted(() => {
           :positive-button-props="{ type: 'error' }"
           positive-text="清除"
           negative-text="取消"
-          @positive-click="chatStore.clearHistoryMessages"
+          @positive-click="chatStore.clearHistoryMessages('voice')"
           @negative-click="() => {}"
         >
           <template #icon>