af-mobile-client-vue3 1.4.53 → 1.4.55

package/src/components/common/MateChat/composables/useMateChat.ts

@@ -0,0 +1,372 @@
+import type {
+  ChatBizResult,
+  ChatStreamCallbacks,
+  MateChatConfig,
+  MateChatMessage,
+} from '@af-mobile-client-vue3/components/common/MateChat/types'
+import { useChatHistoryCache } from '@af-mobile-client-vue3/components/common/MateChat/composables/useChatHistoryCache'
+import { useChatMessagesCache } from '@af-mobile-client-vue3/components/common/MateChat/composables/useChatMessagesCache'
+import { showToast } from 'vant'
+import { ref } from 'vue'
+import { chatBiz, chatCompletionsStream, getPaginationRecords } from '../apiService'
+
+/**
+ * 生成随机 chatId
+ */
+function generateChatId(): string {
+  return `chat_${Date.now()}_${Math.random().toString(36).substring(2, 11)}`
+}
+
+/**
+ * 封装 MateChat 核心对话逻辑的组合式函数
+ * - 负责 startPage / inputValue / messages 等状态
+ * - 根据配置中的 useStream 决定使用非流式(chatBiz)还是流式(chatCompletionsStream)
+ * @param config MateChat 配置对象
+ */
+export function useMateChat(config: MateChatConfig) {
+  const startPage = ref(true)
+  const inputValue = ref('')
+  const messages = ref<MateChatMessage[]>([])
+  const chatId = ref(generateChatId())
+  const useStream = config.useStream
+
+  // 使用历史会话缓存
+  const { clearCache } = useChatHistoryCache()
+  // 使用会话消息缓存
+  const { getCachedMessages, setCachedMessages, appendMessages } = useChatMessagesCache()
+
+  /**
+   * 新建会话：回到起始页并清空历史消息，生成新的 chatId
+   * 同时清除历史会话列表缓存，以便下次打开时重新获取
+   */
+  function newConversation() {
+    startPage.value = true
+    messages.value = []
+    chatId.value = generateChatId()
+    // 清除历史会话列表缓存，下次打开历史会话时会重新获取
+    clearCache(config.appId, config.appKey)
+  }
+
+  /**
+   * 发送一条消息
+   * - 推入用户消息
+   * - 添加一条 loading 的模型消息
+   * - 根据 useStream 调用对应的接口
+   */
+  async function onSubmit(evt: string) {
+    if (!evt.trim()) {
+      return
+    }
+
+    // 如果是从空状态发起的新会话，清除历史会话列表缓存
+    const isNewConversation = startPage.value
+    if (isNewConversation) {
+      clearCache(config.appId, config.appKey)
+    }
+
+    inputValue.value = ''
+    startPage.value = false
+
+    // 用户发送消息
+    messages.value.push({
+      from: 'user',
+      content: evt,
+    })
+
+    // 添加 loading 状态的 model 消息
+    const loadingMessageIndex = messages.value.length
+    messages.value.push({
+      from: 'model',
+      content: '',
+      loading: true,
+    })
+
+    if (!useStream) {
+      // 非流式：一次性拿到完整结果
+      try {
+        const result: ChatBizResult = await chatBiz(
+          evt,
+          config.appId,
+          config.appKey,
+          chatId.value,
+        )
+
+        if (result.type === 'transfer') {
+          // 移除 loading 消息
+          messages.value.splice(loadingMessageIndex, 1)
+          // 添加人工客服消息
+          messages.value.push({
+            from: 'service',
+            content: '您好，客服xxx工号xxx为你服务。功能开发中，敬请期待。',
+          })
+          // 更新缓存：追加用户消息和客服消息
+          appendMessages(chatId.value, [
+            { from: 'user', content: evt },
+            { from: 'service', content: '您好，客服xxx工号xxx为你服务。功能开发中，敬请期待。' },
+          ])
+        }
+        else {
+          // 正常消息：替换 loading 为模型回复
+          messages.value[loadingMessageIndex] = {
+            from: 'model',
+            content: result.content,
+            loading: false,
+          }
+          // 更新缓存：追加用户消息和模型回复
+          appendMessages(chatId.value, [
+            { from: 'user', content: evt },
+            { from: 'model', content: result.content, loading: false },
+          ])
+        }
+      }
+      catch (error: any) {
+        // 处理错误
+        console.error('聊天请求失败:', error)
+        messages.value[loadingMessageIndex] = {
+          from: 'model',
+          content: '抱歉，服务暂时不可用，请稍后再试。',
+          loading: false,
+        }
+        // 更新缓存：追加用户消息和错误消息
+        appendMessages(chatId.value, [
+          { from: 'user', content: evt },
+          { from: 'model', content: '抱歉，服务暂时不可用，请稍后再试。', loading: false },
+        ])
+        showToast(error?.message || '请求失败，请稍后再试')
+      }
+
+      return
+    }
+
+    // 流式：使用 FastGPT SSE，增量更新最后一条模型消息内容，并在前缀为 {"msgType":"transfer"} 时转人工
+    const transferPrefix = '{"msgType":"transfer"'
+    let checkedTransfer = false
+    let transferHandled = false
+    let prefixBuffer = ''
+
+    const callbacks: ChatStreamCallbacks = {
+      onMessage(chunk) {
+        if (transferHandled) {
+          return
+        }
+
+        // 尚未判断是否为转人工前缀
+        if (!checkedTransfer) {
+          const trimmed = chunk.trimStart()
+          if (!trimmed) {
+            // 纯空白，等待下一帧
+            return
+          }
+
+          // 第一个有效字符不是 { ，本次不会是转人工 JSON，后续直接按普通文本处理
+          if (!prefixBuffer && trimmed[0] !== '{') {
+            checkedTransfer = true
+            const msg = messages.value[loadingMessageIndex]
+            if (!msg) {
+              return
+            }
+            msg.content += chunk
+            msg.loading = true
+            return
+          }
+
+          // 有可能是 JSON，累积前缀做精准匹配
+          prefixBuffer += trimmed
+
+          // 如果当前前缀还是 transferPrefix 的前缀，继续等后续 chunk
+          if (transferPrefix.startsWith(prefixBuffer)) {
+            // 还没完整匹配上整个标识，继续等待
+            if (prefixBuffer.length < transferPrefix.length) {
+              return
+            }
+          }
+
+          if (prefixBuffer.startsWith(transferPrefix)) {
+            // 确认是转人工：移除 loading 模型气泡，插入客服气泡
+            messages.value.splice(loadingMessageIndex, 1)
+            messages.value.push({
+              from: 'service',
+              content: '您好，客服xxx工号xxx为你服务。功能开发中，敬请期待。',
+            })
+            transferHandled = true
+            checkedTransfer = true
+            // 更新缓存：追加用户消息和客服消息（在 onComplete 中统一处理）
+            return
+          }
+
+          // 前缀与约定不匹配，当作普通内容处理，并不再尝试转人工识别
+          checkedTransfer = true
+          const msg = messages.value[loadingMessageIndex]
+          if (!msg) {
+            return
+          }
+          msg.content += prefixBuffer
+          msg.loading = true
+          prefixBuffer = ''
+          return
+        }
+
+        // 已经判断过不会转人工，正常流式追加内容
+        const msg = messages.value[loadingMessageIndex]
+        if (!msg) {
+          return
+        }
+        msg.content += chunk
+        msg.loading = true
+      },
+      onComplete() {
+        if (transferHandled) {
+          // 转人工情况：更新缓存
+          appendMessages(chatId.value, [
+            { from: 'user', content: evt },
+            { from: 'service', content: '您好，客服xxx工号xxx为你服务。功能开发中，敬请期待。' },
+          ])
+          return
+        }
+        const msg = messages.value[loadingMessageIndex]
+        if (!msg) {
+          return
+        }
+        msg.loading = false
+        // 流式完成后更新缓存：追加用户消息和完整的模型回复
+        appendMessages(chatId.value, [
+          { from: 'user', content: evt },
+          { from: 'model', content: msg.content, loading: false },
+        ])
+      },
+      onError(error) {
+        console.error('聊天请求失败:', error)
+        const msg = messages.value[loadingMessageIndex]
+        if (!msg) {
+          return
+        }
+        msg.content = '抱歉，服务暂时不可用，请稍后再试。'
+        msg.loading = false
+        // 更新缓存：追加用户消息和错误消息
+        appendMessages(chatId.value, [
+          { from: 'user', content: evt },
+          { from: 'model', content: '抱歉，服务暂时不可用，请稍后再试。', loading: false },
+        ])
+        showToast((error as any)?.message || '请求失败，请稍后再试')
+      },
+    }
+
+    try {
+      await chatCompletionsStream(
+        evt,
+        config.appId,
+        config.appKey,
+        chatId.value,
+        callbacks,
+      )
+    }
+    catch (error: any) {
+      // 兜底错误处理（理论上 callbacks.onError 已经处理）
+      console.error('聊天流式请求异常:', error)
+    }
+  }
+
+  /**
+   * 加载历史会话消息
+   * @param targetChatId 会话 ID
+   */
+  async function loadHistoryMessages(targetChatId: string) {
+    // 先检查缓存
+    const cachedMessages = getCachedMessages(targetChatId)
+    if (cachedMessages) {
+      // 使用缓存数据
+      messages.value = cachedMessages
+      chatId.value = targetChatId
+      startPage.value = false
+      return
+    }
+
+    // 缓存不存在，从服务器获取
+    try {
+      const response = await getPaginationRecords(
+        config.appId,
+        config.appKey,
+        targetChatId,
+        0,
+        10,
+        true,
+      )
+
+      console.log('getPaginationRecords 响应:', response)
+
+      // 检查响应格式
+      if (!response) {
+        throw new Error('响应数据为空')
+      }
+
+      if (response.code !== 200) {
+        throw new Error(response.message || '获取历史消息失败')
+      }
+
+      if (!response.data) {
+        throw new Error('响应数据格式错误：缺少 data 字段')
+      }
+
+      if (!Array.isArray(response.data.list)) {
+        throw new TypeError('响应数据格式错误：list 不是数组')
+      }
+
+      // 清空当前消息
+      messages.value = []
+      // 设置 chatId
+      chatId.value = targetChatId
+
+      // 转换历史消息格式
+      const historyMessages: MateChatMessage[] = []
+      for (const record of response.data.list) {
+        if (record.hideInUI) {
+          continue
+        }
+
+        // 提取消息内容
+        const content = record.value?.[0]?.text?.content || ''
+
+        if (!content) {
+          // 跳过空内容的消息
+          continue
+        }
+
+        if (record.obj === 'Human') {
+          historyMessages.push({
+            from: 'user',
+            content,
+          })
+        }
+        else if (record.obj === 'AI') {
+          historyMessages.push({
+            from: 'model',
+            content,
+            loading: false,
+          })
+        }
+      }
+
+      messages.value = historyMessages
+      startPage.value = false
+
+      // 缓存历史消息
+      setCachedMessages(targetChatId, historyMessages)
+
+      console.log('历史消息加载成功，共', historyMessages.length, '条消息')
+    }
+    catch (error: any) {
+      console.error('加载历史消息失败:', error)
+      showToast(error?.message || '加载历史消息失败，请稍后再试')
+    }
+  }
+
+  return {
+    startPage,
+    inputValue,
+    messages,
+    chatId,
+    newConversation,
+    onSubmit,
+    loadHistoryMessages,
+  }
+}

package/src/components/common/MateChat/composables/usePasswordManager.ts

@@ -0,0 +1,38 @@
+import { createStorage } from '@af-mobile-client-vue3/utils/Storage'
+
+// 创建 localStorage 实例用于存储密码
+const passwordStorage = createStorage({ storage: localStorage })
+const PASSWORD_STORAGE_KEY = 'mateChat_password'
+
+/**
+ * 密码管理组合式函数
+ * 提供密码的存储、读取和清除功能
+ */
+export function usePasswordManager() {
+  /**
+   * 从 localStorage 读取保存的密码
+   */
+  function getStoredPassword(): string | null {
+    return passwordStorage.get(PASSWORD_STORAGE_KEY, null)
+  }
+
+  /**
+   * 将密码保存到 localStorage
+   */
+  function savePassword(password: string) {
+    passwordStorage.set(PASSWORD_STORAGE_KEY, password)
+  }
+
+  /**
+   * 清除保存的密码
+   */
+  function clearPassword() {
+    passwordStorage.remove(PASSWORD_STORAGE_KEY)
+  }
+
+  return {
+    getStoredPassword,
+    savePassword,
+    clearPassword,
+  }
+}