From 3c8d2dab7e3f6c99327af41cbd89d33906489f25 Mon Sep 17 00:00:00 2001
From: Jafeng <2998840497@qq.com>
Date: Mon, 25 Aug 2025 14:45:12 +0800
Subject: [PATCH] fix(frontend): use uuid v4 instead of crypto.randomUUID

---
 frontend/package.json           | 1 +
 frontend/src/views/ChatView.vue | 9 +++++----
 2 files changed, 6 insertions(+), 4 deletions(-)

diff --git a/frontend/package.json b/frontend/package.json
index 2af11bd..488f4c5 100644
--- a/frontend/package.json
+++ b/frontend/package.json
@@ -18,6 +18,7 @@
   ,"marked": "^6.0.0",
   "dompurify": "^3.0.0",
   "highlight.js": "^11.8.0"
+  ,"uuid": "^9.0.0"
   },
   "devDependencies": {
     "@types/node": "^24.3.0",
diff --git a/frontend/src/views/ChatView.vue b/frontend/src/views/ChatView.vue
index 41874ed..001c0ba 100644
--- a/frontend/src/views/ChatView.vue
+++ b/frontend/src/views/ChatView.vue
@@ -37,6 +37,7 @@
 
 <script setup lang="ts">
 import { ref, onMounted, nextTick, computed, watch } from 'vue';
+import { v4 as uuidv4 } from 'uuid';
 import { useModelStore } from '@/stores/modelStore';
 import { chatWithModel, StreamPayload } from '@/services/chatService';
 import { useConversationStore } from '@/stores/conversationStore';
@@ -70,9 +71,9 @@ function formatMessage(md: string) {
 async function handleSend() {
   const text = input.value.trim();
   if (!text || pending.value) return;
-  const userMsg: ChatMessage = { id: crypto.randomUUID(), role: 'user', content: text, html: renderMarkdown(text) };
+  const userMsg: ChatMessage = { id: uuidv4(), role: 'user', content: text, html: renderMarkdown(text) };
   messages.value.push(userMsg);
-  const aiId = crypto.randomUUID();
+  const aiId = uuidv4();
   messages.value.push({ id: aiId, role: 'assistant', segments: [], loading: true, html: '' });
   input.value = '';
   pending.value = true;
@@ -146,8 +147,8 @@ watch(() => convStore.currentId, (id) => {
   if (!id) { messages.value = []; conversationId.value = null; return; }
   // load messages from store and precompute html
   messages.value = convStore.messages.map(m => m.role === 'user'
-    ? { id: crypto.randomUUID(), role: 'user', content: m.content, html: renderMarkdown(m.content) }
-    : { id: crypto.randomUUID(), role: 'assistant', segments: [{ kind: 'answer', text: m.content, html: renderMarkdown(m.content) }] }
+    ? { id: uuidv4(), role: 'user', content: m.content, html: renderMarkdown(m.content) }
+    : { id: uuidv4(), role: 'assistant', segments: [{ kind: 'answer', text: m.content, html: renderMarkdown(m.content) }] }
   );
   conversationId.value = id;
   scrollBottom();