From 73741dd583ed5256ce4e827d669eb5367883fa3b Mon Sep 17 00:00:00 2001 From: aaron <> Date: Sun, 11 May 2025 00:10:46 +0800 Subject: [PATCH] update --- docker-compose.yml | 2 +- src/views/AIAgentView.vue | 172 ++++++++++++++++++++++++++++++++++++-- 2 files changed, 167 insertions(+), 7 deletions(-) diff --git a/docker-compose.yml b/docker-compose.yml index f7a4814..5abc062 100644 --- a/docker-compose.yml +++ b/docker-compose.yml @@ -5,7 +5,7 @@ services: build: context: . dockerfile: Dockerfile - image: tradus-web:1.1 + image: tradus-web:1.2 container_name: tradus-web ports: - '6000:80' diff --git a/src/views/AIAgentView.vue b/src/views/AIAgentView.vue index 5c04c14..9bb28c8 100644 --- a/src/views/AIAgentView.vue +++ b/src/views/AIAgentView.vue @@ -153,6 +153,54 @@ watch(selectedAgent, (newAgent) => { } }) +// 获取当前agent的会话ID +const getConversationId = (agentId: string) => { + const key = `conversation_${agentId}` + return localStorage.getItem(key) +} + +// 保存当前agent的会话ID +const saveConversationId = (agentId: string, conversationId: string) => { + const key = `conversation_${agentId}` + localStorage.setItem(key, conversationId) +} + +// 清除当前agent的会话ID +const clearConversationId = (agentId: string) => { + const key = `conversation_${agentId}` + localStorage.removeItem(key) +} + +const showConfirmDialog = ref(false) +const confirmDialogTitle = ref('') +const confirmDialogMessage = ref('') +const confirmCallback = ref<(() => void) | null>(null) + +const showConfirm = (title: string, message: string, callback: () => void) => { + confirmDialogTitle.value = title + confirmDialogMessage.value = message + confirmCallback.value = callback + showConfirmDialog.value = true +} + +// 选择Agent +const selectAgent = (agent: Agent) => { + if (!selectedAgent.value || agent.id !== selectedAgent.value.id) { + // 切换到新的 Agent + showConfirm('切换 Agent', `是否开启新的 Agent:${agent.name}?`, () => { + selectedAgent.value = agent + clearConversationId(agent.id) + showConfirmDialog.value = false + }) + } else { + // 点击当前 Agent + showConfirm('重新开始对话', '是否重新开启新会话?', () => { + clearConversationId(agent.id) + showConfirmDialog.value = false + }) + } +} + const sendMessage = async () => { if (!userInput.value.trim() || isLoading.value || !isAuthenticated.value || !selectedAgent.value) return @@ -191,11 +239,13 @@ const sendMessage = async () => { 'Content-Type': 'application/json', } - // 添加认证头 if (userStore.authHeader) { headers['Authorization'] = userStore.authHeader } + // 获取当前agent的会话ID + const conversationId = selectedAgent.value ? getConversationId(selectedAgent.value.id) : null + // 调用流式接口 const response = await fetch(`${apiBaseUrl}/agent/chat`, { method: 'POST', @@ -203,6 +253,7 @@ const sendMessage = async () => { body: JSON.stringify({ user_prompt: currentInput, agent_id: selectedAgent.value.id, + conversation_id: conversationId, }), }) @@ -231,6 +282,11 @@ const sendMessage = async () => { try { const data = JSON.parse(line.slice(6)) + // 处理 conversation_id + if (data.conversation_id && selectedAgent.value) { + saveConversationId(selectedAgent.value.id, data.conversation_id) + } + switch (data.event) { case 'agent_message': if (data.answer) { @@ -285,11 +341,6 @@ const sendMessage = async () => { } } -// 选择Agent -const selectAgent = (agent: Agent) => { - selectedAgent.value = agent -} - // 在 script 部分添加图标渲染函数 const getAgentIcon = (agent: Agent) => { // 根据 agent 类型返回对应的 SVG 图标 @@ -396,6 +447,27 @@ const getIconPath = (agent: Agent) => { + + +
+
+

{{ confirmDialogTitle }}

+

{{ confirmDialogMessage }}

+
+ + +
+
+
@@ -1023,4 +1095,92 @@ const getIconPath = (agent: Agent) => { color: white; background-color: rgba(255, 255, 255, 0.1); } + +/* 添加确认对话框样式 */ +.confirm-dialog { + position: fixed; + top: 0; + left: 0; + right: 0; + bottom: 0; + background-color: rgba(0, 0, 0, 0.5); + display: flex; + justify-content: center; + align-items: center; + z-index: 1000; + backdrop-filter: blur(4px); +} + +.confirm-dialog-content { + background-color: #ffffff; + color: #000000; + padding: 2rem; + border-radius: var(--border-radius); + max-width: 400px; + width: calc(100% - 2rem); + margin: 1rem; + box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); + border: 1px solid #e5e7eb; +} + +.confirm-dialog-content h3 { + font-size: 1.5rem; + margin-bottom: 1rem; + color: #000000; +} + +.confirm-dialog-content p { + color: #4b5563; + margin-bottom: 2rem; + line-height: 1.5; +} + +.confirm-actions { + display: flex; + justify-content: center; + gap: 1rem; +} + +.confirm-actions button { + padding: 0.8rem 2rem; + border-radius: var(--border-radius); + font-weight: 500; + cursor: pointer; + transition: all 0.2s ease; + min-width: 100px; +} + +.confirm-actions button:first-child { + background-color: var(--color-accent); + color: white; + border: none; +} + +.confirm-actions button:first-child:hover { + background-color: var(--color-accent-hover); +} + +.confirm-actions button:last-child { + background-color: #f3f4f6; + color: #000000; + border: 1px solid #e5e7eb; +} + +.confirm-actions button:last-child:hover { + background-color: #e5e7eb; +} + +@media (max-width: 480px) { + .confirm-dialog-content { + padding: 1.5rem; + } + + .confirm-dialog-content h3 { + font-size: 1.3rem; + } + + .confirm-actions button { + padding: 0.6rem 1.5rem; + } +}