Uniapp/lucky_shop
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

临时保存代码

Browse Source
This commit is contained in:
ZF Sun
2025-11-11 09:10:36 +08:00
parent 526c813d8d
commit 97f6971bd0
9 changed files with 644 additions and 41 deletions
Download Patch File Download Diff File Expand all files Collapse all files

210
components/ai-chat-message/ai-chat-message.vue
View File

@@ -277,6 +277,7 @@
<script>
import nsLoading from '@/components/ns-loading/ns-loading.vue'
import aiService from '@/common/js/ai-service.js'
export default {
name: 'ai-chat-message',
@@ -336,7 +337,12 @@ export default {
streamingMessage: null, // 流式消息对象
streamInterval: null, // 流式更新定时器
streamContent: '', // 流式内容缓存
isStreaming: false // 是否正在流式输出
isStreaming: false, // 是否正在流式输出
// Dify API相关
currentConversationId: null, // 当前会话ID
isAIServiceAvailable: true, // AI服务是否可用
aiServiceError: null // AI服务错误信息
}
},
created() {
@@ -370,7 +376,7 @@ export default {
},
// 发送消息
sendMessage() {
async sendMessage() {
if (!this.inputText.trim()) return
const userMessage = {
@@ -394,28 +400,122 @@ export default {
}
this.messages.push(loadingMessage)
// 模拟AI回复
setTimeout(() => {
try {
// 检查AI服务状态
const status = await aiService.getServiceStatus()
this.isAIServiceAvailable = status.available
if (!this.isAIServiceAvailable) {
throw new Error('AI服务暂不可用')
}
// 使用AI服务获取回复
if (this.enableStreaming) {
// 流式响应
await this.sendStreamMessage(userMessage.content)
} else {
// 普通响应
await this.sendNormalMessage(userMessage.content)
}
} catch (error) {
console.error('AI服务调用失败:', error)
// 移除加载状态
this.messages = this.messages.filter(msg => msg.type !== 'loading')
const aiMessage = {
// 显示错误消息
const errorMessage = {
id: ++this.messageId,
role: 'ai',
type: 'text',
content: this.generateAIResponse(userMessage.content),
content: '抱歉，AI服务暂时不可用，请稍后重试。',
timestamp: Date.now(),
actions: [
{ id: 1, text: '有帮助', type: 'like' },
{ id: 2, text: '没帮助', type: 'dislike' }
{ id: 1, text: '重试', type: 'retry' }
]
}
this.messages.push(aiMessage)
// 触发消息发送事件
this.$emit('message-sent', userMessage)
this.$emit('ai-response', aiMessage)
}, 1000)
this.messages.push(errorMessage)
this.$emit('ai-response', errorMessage)
}
// 触发消息发送事件
this.$emit('message-sent', userMessage)
},
// 发送普通消息
async sendNormalMessage(userMessage) {
const response = await aiService.sendMessage(userMessage, {
conversationId: this.currentConversationId,
stream: false
})
// 移除加载状态
this.messages = this.messages.filter(msg => msg.type !== 'loading')
// 更新会话ID
if (response.conversationId) {
this.currentConversationId = response.conversationId
}
const aiMessage = {
id: ++this.messageId,
role: 'ai',
type: 'text',
content: response.content,
timestamp: Date.now(),
conversationId: response.conversationId,
messageId: response.messageId,
actions: [
{ id: 1, text: '有帮助', type: 'like' },
{ id: 2, text: '没帮助', type: 'dislike' }
]
}
this.messages.push(aiMessage)
this.$emit('ai-response', aiMessage)
},
// 发送流式消息
async sendStreamMessage(userMessage) {
// 创建流式消息对象
const streamMessage = {
id: ++this.messageId,
role: 'ai',
type: 'text',
content: '',
timestamp: Date.now(),
isStreaming: true
}
// 移除加载状态，添加流式消息
this.messages = this.messages.filter(msg => msg.type !== 'loading')
this.messages.push(streamMessage)
// 开始流式响应
await aiService.sendStreamMessage(
userMessage,
// 流式数据回调
(chunk) => {
streamMessage.content += chunk
// 触发内容更新
this.$forceUpdate()
},
// 完成回调
(completeContent) => {
streamMessage.isStreaming = false
streamMessage.content = completeContent
// 添加操作按钮
streamMessage.actions = [
{ id: 1, text: '有帮助', type: 'like' },
{ id: 2, text: '没帮助', type: 'dislike' }
]
this.$emit('ai-response', streamMessage)
}
)
},
// 生成AI回复（模拟）
@@ -684,9 +784,91 @@ export default {
// 处理操作
handleAction(action, message) {
// 处理重试操作
if (action.type === 'retry') {
this.retryMessage(message)
return
}
this.$emit('action-click', { action, message })
},
// 重试消息
async retryMessage(message) {
// 找到对应的用户消息
const userMessageIndex = this.messages.findIndex(msg =>
msg.role === 'user' && msg.id < message.id
)
if (userMessageIndex !== -1) {
const userMessage = this.messages[userMessageIndex]
// 移除错误消息
this.messages = this.messages.filter(msg => msg.id !== message.id)
// 重新发送消息
await this.sendMessageWithContent(userMessage.content)
}
},
// 使用指定内容发送消息
async sendMessageWithContent(content) {
const userMessage = {
id: ++this.messageId,
role: 'user',
type: 'text',
content: content,
timestamp: Date.now()
}
this.messages.push(userMessage)
// 显示AI正在输入
const loadingMessage = {
id: ++this.messageId,
role: 'ai',
type: 'loading',
content: '',
timestamp: Date.now()
}
this.messages.push(loadingMessage)
try {
// 使用AI服务获取回复
if (this.enableStreaming) {
// 流式响应
await this.sendStreamMessage(userMessage.content)
} else {
// 普通响应
await this.sendNormalMessage(userMessage.content)
}
} catch (error) {
console.error('AI服务调用失败:', error)
// 移除加载状态
this.messages = this.messages.filter(msg => msg.type !== 'loading')
// 显示错误消息
const errorMessage = {
id: ++this.messageId,
role: 'ai',
type: 'text',
content: '抱歉，AI服务暂时不可用，请稍后重试。',
timestamp: Date.now(),
actions: [
{ id: 1, text: '重试', type: 'retry' }
]
}
this.messages.push(errorMessage)
this.$emit('ai-response', errorMessage)
}
// 触发消息发送事件
this.$emit('message-sent', userMessage)
},
// 输入事件
onInput(e) {
this.$emit('input-change', e.detail.value)