From 82d3ae5b44e4fe562cf053d74a6724a87dae33e0 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E8=B5=B5=E5=BF=A0=E6=9E=97?= <170083662@qq.com> Date: Fri, 11 Jul 2025 22:25:32 +0800 Subject: [PATCH] =?UTF-8?q?=E4=BC=98=E5=8C=96=EF=BC=9A=E5=BA=95=E9=83=A8?= =?UTF-8?q?=E5=AF=BC=E8=88=AA=E8=8F=9C=E5=8D=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/api/ai/index.ts | 54 +++++++++++++++--------------- src/components/SimpleH5TabBar.scss | 53 +++++++++++++---------------- src/components/SimpleH5TabBar.tsx | 23 ++++++++++--- src/pages/ai/index.tsx | 49 +++++++++++++++------------ 4 files changed, 97 insertions(+), 82 deletions(-) diff --git a/src/api/ai/index.ts b/src/api/ai/index.ts index 43f0a3b..4130c5e 100644 --- a/src/api/ai/index.ts +++ b/src/api/ai/index.ts @@ -1,53 +1,53 @@ import request from '@/utils/request'; -import type { ApiResult } from '@/api/index'; +import type {ApiResult} from '@/api/index'; /** * AI聊天消息接口 */ export interface AiChatMessage { - query: string; - user?: string; - responseMode?: string; - conversationId?: string; - type?: string; - requestType?: number; - aiToken?: string; + query: string; + user?: string; + responseMode?: string; + conversationId?: string; + type?: string; + requestType?: number; + aiToken?: string; } /** * AI聊天响应接口 */ export interface AiChatResponse { - answer: string; - taskId: string; + answer: string; + taskId: string; } /** * 发送AI聊天消息 */ export async function sendAiMessage(data: AiChatMessage) { - const res = await request.post>( - '/chat/message', - data - ); - if (res.code === 0) { - return res.data; - } - return Promise.reject(new Error(res.message)); + const res = await request.post>( + '/chat/message', + data + ); + if (res.code === 0) { + return res.data; + } + return Promise.reject(new Error(res.message)); } /** * 停止AI聊天 */ -export async function stopAiMessage(data: { taskId: string; type?: string }) { - const res = await request.post>( - '/chat/messageStop', - data - ); - if (res.code === 0) { - return res.data; - } - return Promise.reject(new Error(res.message)); +export async function stopAiMessage(data: { taskId: string; authCode?: string; user?: string; type?: string }) { + const res = await request.post>( + 'https://ai-console.gxshucheng.com/ai-console-api/stop/v1', + data + ); + if (res.code === 0) { + return res.data; + } + return Promise.reject(new Error(res.message)); } diff --git a/src/components/SimpleH5TabBar.scss b/src/components/SimpleH5TabBar.scss index 48bb78c..54c4cef 100644 --- a/src/components/SimpleH5TabBar.scss +++ b/src/components/SimpleH5TabBar.scss @@ -11,10 +11,10 @@ .h5-tabbar-container { display: flex; - height: 60px; - align-items: center; + height: 88px; + align-items: flex-end; justify-content: space-around; - padding: 0 16px; + padding: 4px 0; width: 100%; .h5-tabbar-item { @@ -32,8 +32,6 @@ display: flex; align-items: center; justify-content: center; - width: 28px; - height: 28px; margin-bottom: 4px; transition: transform 0.3s ease; @@ -41,6 +39,11 @@ font-size: 20px; transition: transform 0.3s ease; } + + // 确保图片图标保持正方形 + image { + border-radius: 2px; + } } // 特殊AI按钮样式 @@ -48,35 +51,39 @@ display: flex; align-items: center; justify-content: center; - margin-bottom: -8px; + margin-bottom: -10px; .h5-ai-circle { - width: 48px; - height: 48px; border-radius: 50%; - background: #ffffff; display: flex; align-items: center; justify-content: center; position: relative; - top: -20px; + top: -8px; transition: all 0.3s ease; .h5-ai-text { color: #ffffff; - font-size: 14px; + font-size: 18px; font-weight: bold; text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2); } + // 确保AI图标保持正方形并居中 + image { + border-radius: 4px; + } + // 光晕效果 &::before { + background-color: #ffffff; + box-shadow: 0 4px 12px rgba(255, 255, 255, 0.8); content: ''; position: absolute; - top: -4px; - left: -4px; - right: -4px; - bottom: -4px; + top: -10px; + left: -7px; + right: -7px; + bottom: -7px; border-radius: 50%; opacity: 0; transition: opacity 0.3s ease; @@ -90,19 +97,18 @@ // 文字样式 .h5-tabbar-text { - font-size: 12px; + font-size: 18px; color: #8a8a8a; transition: color 0.3s ease; text-align: center; line-height: 1.2; + z-index: 100; &.selected { - color: #d81e06; font-weight: 500; } &.special-text { - color: #ff6b35; font-weight: 500; margin-top: -12px; } @@ -126,17 +132,6 @@ opacity: 1; } } - - &.selected { - .h5-special-icon .h5-ai-circle { - background: linear-gradient(135deg, #ff6b35 0%, #ff4500 100%); - box-shadow: 0 6px 16px rgba(255, 69, 0, 0.5); - - &::before { - background: linear-gradient(135deg, rgba(255, 107, 53, 0.5) 0%, rgba(255, 69, 0, 0.5) 100%); - } - } - } } // 点击效果 diff --git a/src/components/SimpleH5TabBar.tsx b/src/components/SimpleH5TabBar.tsx index a3193cd..9f6c5d2 100644 --- a/src/components/SimpleH5TabBar.tsx +++ b/src/components/SimpleH5TabBar.tsx @@ -1,8 +1,7 @@ import {useState, useEffect} from 'react'; -import {View, Text} from '@tarojs/components'; +import {View, Text, Image} from '@tarojs/components'; import Taro from '@tarojs/taro'; import './SimpleH5TabBar.scss'; -import {Image} from '@nutui/nutui-react-taro' interface TabBarProps { current?: number; @@ -73,12 +72,28 @@ function SimpleH5TabBar({current}: TabBarProps) { {item.isSpecial ? ( - + ) : ( - + )} { const [messages, setMessages] = useState([]); const [inputValue, setInputValue] = useState(''); const [isLoading, setIsLoading] = useState(false); - // const [currentTaskId, setCurrentTaskId] = useState(''); + const [currentTaskId, setCurrentTaskId] = useState(''); const [wsConnected, setWsConnected] = useState(false); const [isInitialized, setIsInitialized] = useState(false); const messagesEndRef = useRef(null); @@ -79,8 +78,8 @@ const AiChat = () => { wsRef.current = createWebSocket(WSS_API_URL + "/chat/" + userToken); wsRef.current.onMessage((data: any) => { - console.log('收到WebSocket消息:', data); - + console.log('收到WebSocket消息:', data.taskId); + setCurrentTaskId(data.taskId) if (data.answer) { if (data.answer === '__END__') { // 消息结束，移除typing状态 @@ -275,20 +274,24 @@ const AiChat = () => { }; // 停止AI回复 - // const handleStopMessage = async () => { - // if (currentTaskId) { - // try { - // await stopAiMessage({taskId: currentTaskId}); - // setIsLoading(false); - // setCurrentTaskId(''); - // setMessages(prev => prev.map(msg => - // msg.isTyping ? {...msg, isTyping: false} : msg - // )); - // } catch (error) { - // console.error('停止消息失败:', error); - // } - // } - // }; + const handleStop = async () => { + if (currentTaskId) { + try { + await stopAiMessage({ + taskId: currentTaskId, + authCode: '1fbfa21a-a3df-445e-9ca5-2c1a9eead7f4', + user: `${Taro.getStorageSync('AI_TOKEN') || 'anonymous'}` + }); + setIsLoading(false); + setCurrentTaskId(''); + setMessages(prev => prev.map(msg => + msg.isTyping ? {...msg, isTyping: false} : msg + )); + } catch (error) { + console.error('停止消息失败:', error); + } + } + }; // 处理快捷问题点击 const handleQuickQuestion = (question: string) => { @@ -385,7 +388,8 @@ const AiChat = () => {
- Taro.reLaunch({url: '/pages/index/index'})}/> + Taro.reLaunch({url: '/pages/index/index'})}/>