af-mobile-client-vue3 1.4.55 → 1.4.56

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "af-mobile-client-vue3",
   "type": "module",
-  "version": "1.4.55",
+  "version": "1.4.56",
   "packageManager": "pnpm@10.13.1",
   "description": "Vue + Vite component lib",
   "engines": {

package/src/components/common/MateChat/components/MateChatContent.vue

@@ -186,7 +186,7 @@ function handleSelectSession(session: { chatId: string, title: string, lastTime:
 .chat-card {
   width: 100%;
   max-width: 1200px;
-  height: calc(100vh - 40px);
+  height: calc(100% - 40px);
   background: #ffffff;
   border-radius: 24px;
   box-shadow: 0 20px 60px rgba(0, 0, 0, 0.15);
@@ -205,7 +205,7 @@ function handleSelectSession(session: { chatId: string, title: string, lastTime:
 /* 移动端适配 */
 @media (max-width: 768px) {
   .chat-card {
-    height: calc(100vh - 16px);
+    height: calc(100% - 16px);
     border-radius: 16px;
     padding: 8px;
   }

package/src/components/common/MateChat/index.vue

@@ -41,6 +41,21 @@ const finalLoading = computed(() => forceLoading.value || isLoading.value || !!c
 // 当前使用的配置
 const currentConfig = ref<MateChatConfig | null>(null)
 
+const defaultBackgroundGradient = 'background: linear-gradient(to bottom, #d0c9ff 0%, #e6d6f0 8%, #f1dbea 12%, #c8dcfb 40%, #abc6f6 60%, #87aefe 90%)'
+// 琉璃配色
+// background: linear-gradient(to bottom, #a8f0ed 0%, #a8e6cf 8%, #c5b3ff 12%, #e0b3ff 40%, #fff4b8 60%, #ffb8d1 90%);
+// 紫罗兰配色
+// background: linear-gradient(to bottom, #d0c9ff 0%, #e6d6f0 8%, #f1dbea 12%, #c8dcfb 40%, #abc6f6 60%, #87aefe 90%);
+// 蓝白配色
+// 'linear-gradient(to bottom, #1c57e0 0%, #3b82f6 20%, #60a5fa 40%, #93c5fd 60%, #dbeafe 80%, #ffffff 100%)'
+// 计算背景渐变样式
+const backgroundStyle = computed(() => {
+  const gradient = currentConfig.value?.backgroundGradient || defaultBackgroundGradient
+  return {
+    background: gradient,
+  }
+})
+
 // 存储原始配置数据
 const rawConfigs = ref<MateChatConfigs | MateChatConfig | null>(null)
 
@@ -305,7 +320,7 @@ onMounted(() => {
 </script>
 
 <template>
-  <div id="mate-chat-view">
+  <div id="mate-chat-view" :style="backgroundStyle">
     <!-- 密码输入对话框 -->
     <PasswordDialog
       ref="passwordDialogRef"
@@ -351,9 +366,8 @@ onMounted(() => {
 #mate-chat-view {
   /* 外层渐变背景容器 */
   width: 100%;
-  min-height: 100vh;
-  background: linear-gradient(to bottom, #a8f0ed 0%, #a8e6cf 8%, #c5b3ff 12%, #e0b3ff 40%, #fff4b8 60%, #ffb8d1 90%);
-  /* background: linear-gradient(to bottom, #d0c9ff 0%, #e6d6f0 8%, #f1dbea 12%, #c8dcfb 40%, #abc6f6 60%, #87aefe 90%); */
+  min-height: 100%;
+  /* 背景色通过 :style 绑定从配置中获取 */
   padding: 20px;
   display: flex;
   justify-content: center;
@@ -381,7 +395,7 @@ onMounted(() => {
 
     /* 移动端适配 */
     @media (max-width: 768px) {
-      height: calc(100vh - 16px);
+      height: calc(100% - 18px);
       border-radius: 16px;
       padding: 8px;
     }

package/src/components/common/MateChat/types.ts

@@ -1,236 +1,241 @@
-/**
- * MateChat 提示项接口
- */
-export interface MateChatPromptItem {
-  value: string
-  label: string
-  iconConfig?: {
-    name: string
-    color?: string
-  }
-  desc?: string
-}
-
-/**
- * MateChat 配置接口
- */
-export interface MateChatConfig {
-  /**
-   * 可选密码，如果存在则需要密码验证
-   */
-  password?: string
-  /**
-   * FastGPT 应用 ID
-   */
-  appId: string
-  /**
-   * FastGPT API Key
-   */
-  appKey: string
-  /**
-   * 介绍文案
-   */
-  description: string[]
-  /**
-   * 首屏推荐问题列表
-   */
-  introPrompt: MateChatPromptItem[]
-  /**
-   * 底部快捷问题列表
-   */
-  simplePrompt: MateChatPromptItem[]
-  /**
-   * 客服名称
-   */
-  serviceName: string
-  /**
-   * 是否使用流式对话
-   */
-  useStream: boolean
-}
-
-/**
- * 配置中心返回的多个配置对象
- * key 为配置名称，value 为 MateChatConfig
- */
-export type MateChatConfigs = Record<string, MateChatConfig>
-
-// ==================== API 相关类型定义 ====================
-
-/**
- * 聊天消息接口
- */
-export interface ChatMessage {
-  role: 'user' | 'assistant' | 'system'
-  content: string
-}
-
-/**
- * 聊天请求参数接口
- */
-export interface ChatCompletionsRequest {
-  chatId: string
-  stream: boolean
-  detail: boolean
-  messages: ChatMessage[]
-  customUid?: string
-}
-
-/**
- * 聊天响应使用情况接口
- */
-export interface ChatUsage {
-  prompt_tokens: number
-  completion_tokens: number
-  total_tokens: number
-}
-
-/**
- * 聊天响应选择项接口
- */
-export interface ChatChoice {
-  message: {
-    role: 'assistant'
-    content: string
-  }
-  finish_reason: string
-  index: number
-}
-
-/**
- * 聊天响应接口
- */
-export interface ChatCompletionsResponse {
-  id: string
-  model: string
-  usage: ChatUsage
-  choices: ChatChoice[]
-}
-
-/**
- * 业务层聊天结果
- */
-export interface ChatBizResult {
-  /**
-   * normal: 普通回复
-   * transfer: 转人工
-   */
-  type: 'normal' | 'transfer'
-  /**
-   * 大模型原始返回内容
-   */
-  content: string
-}
-
-/**
- * 流式对话回调
- */
-export interface ChatStreamCallbacks {
-  /**
-   * 每次收到 FastGPT SSE 的增量内容时触发
-   */
-  onMessage?: (chunk: string) => void
-  /**
-   * 流结束时触发（包括收到 [DONE] 或正常读取结束）
-   */
-  onComplete?: () => void
-  /**
-   * 请求或解析发生异常时触发
-   */
-  onError?: (error: unknown) => void
-}
-
-/**
- * 历史会话项接口
- */
-export interface ChatHistoryItem {
-  chatId: string
-  updateTime: string
-  appId: string
-  customTitle: string
-  title: string
-  top: boolean
-  [key: string]: any
-}
-
-/**
- * 历史会话查询请求参数接口
- */
-export interface GetHistoriesRequest {
-  appId: string
-  outLinkUid: string
-  offset: number
-  pageSize: number
-  source: string
-}
-
-/**
- * 历史会话查询响应接口
- */
-export interface GetHistoriesResponse {
-  code: number
-  statusText: string
-  message: string
-  data: {
-    list: ChatHistoryItem[]
-    total: number
-  }
-}
-
-/**
- * 历史会话记录项接口
- */
-export interface ChatRecordItem {
-  _id: string
-  dataId: string
-  hideInUI: boolean
-  obj: 'Human' | 'AI'
-  value: Array<{
-    type: string
-    text: {
-      content: string
-    }
-  }>
-  customFeedbacks: any[]
-  time: string
-  durationSeconds?: number
-  llmModuleAccount?: number
-  totalQuoteList?: any[]
-  historyPreviewLength?: number
-  [key: string]: any
-}
-
-/**
- * 获取历史会话记录请求参数接口
- */
-export interface GetPaginationRecordsRequest {
-  appId: string
-  chatId: string
-  offset: number
-  pageSize: number
-  loadCustomFeedbacks: boolean
-}
-
-/**
- * 获取历史会话记录响应接口
- */
-export interface GetPaginationRecordsResponse {
-  code: number
-  statusText: string
-  message: string
-  data: {
-    list: ChatRecordItem[]
-    total: number
-  }
-}
-
-// ==================== MateChat 组件内部类型 ====================
-
-/**
- * MateChat 组件内部使用的消息结构
- */
-export interface MateChatMessage {
-  from: 'user' | 'model' | 'service'
-  content: string
-  loading?: boolean
-}
+/**
+ * MateChat 提示项接口
+ */
+export interface MateChatPromptItem {
+  value: string
+  label: string
+  iconConfig?: {
+    name: string
+    color?: string
+  }
+  desc?: string
+}
+
+/**
+ * MateChat 配置接口
+ */
+export interface MateChatConfig {
+  /**
+   * 可选密码，如果存在则需要密码验证
+   */
+  password?: string
+  /**
+   * FastGPT 应用 ID
+   */
+  appId: string
+  /**
+   * FastGPT API Key
+   */
+  appKey: string
+  /**
+   * 介绍文案
+   */
+  description: string[]
+  /**
+   * 首屏推荐问题列表
+   */
+  introPrompt: MateChatPromptItem[]
+  /**
+   * 底部快捷问题列表
+   */
+  simplePrompt: MateChatPromptItem[]
+  /**
+   * 客服名称
+   */
+  serviceName: string
+  /**
+   * 是否使用流式对话
+   */
+  useStream: boolean
+  /**
+   * 背景渐变颜色（CSS linear-gradient 字符串）
+   * 如果不提供，使用默认蓝白渐变
+   */
+  backgroundGradient?: string
+}
+
+/**
+ * 配置中心返回的多个配置对象
+ * key 为配置名称，value 为 MateChatConfig
+ */
+export type MateChatConfigs = Record<string, MateChatConfig>
+
+// ==================== API 相关类型定义 ====================
+
+/**
+ * 聊天消息接口
+ */
+export interface ChatMessage {
+  role: 'user' | 'assistant' | 'system'
+  content: string
+}
+
+/**
+ * 聊天请求参数接口
+ */
+export interface ChatCompletionsRequest {
+  chatId: string
+  stream: boolean
+  detail: boolean
+  messages: ChatMessage[]
+  customUid?: string
+}
+
+/**
+ * 聊天响应使用情况接口
+ */
+export interface ChatUsage {
+  prompt_tokens: number
+  completion_tokens: number
+  total_tokens: number
+}
+
+/**
+ * 聊天响应选择项接口
+ */
+export interface ChatChoice {
+  message: {
+    role: 'assistant'
+    content: string
+  }
+  finish_reason: string
+  index: number
+}
+
+/**
+ * 聊天响应接口
+ */
+export interface ChatCompletionsResponse {
+  id: string
+  model: string
+  usage: ChatUsage
+  choices: ChatChoice[]
+}
+
+/**
+ * 业务层聊天结果
+ */
+export interface ChatBizResult {
+  /**
+   * normal: 普通回复
+   * transfer: 转人工
+   */
+  type: 'normal' | 'transfer'
+  /**
+   * 大模型原始返回内容
+   */
+  content: string
+}
+
+/**
+ * 流式对话回调
+ */
+export interface ChatStreamCallbacks {
+  /**
+   * 每次收到 FastGPT SSE 的增量内容时触发
+   */
+  onMessage?: (chunk: string) => void
+  /**
+   * 流结束时触发（包括收到 [DONE] 或正常读取结束）
+   */
+  onComplete?: () => void
+  /**
+   * 请求或解析发生异常时触发
+   */
+  onError?: (error: unknown) => void
+}
+
+/**
+ * 历史会话项接口
+ */
+export interface ChatHistoryItem {
+  chatId: string
+  updateTime: string
+  appId: string
+  customTitle: string
+  title: string
+  top: boolean
+  [key: string]: any
+}
+
+/**
+ * 历史会话查询请求参数接口
+ */
+export interface GetHistoriesRequest {
+  appId: string
+  outLinkUid: string
+  offset: number
+  pageSize: number
+  source: string
+}
+
+/**
+ * 历史会话查询响应接口
+ */
+export interface GetHistoriesResponse {
+  code: number
+  statusText: string
+  message: string
+  data: {
+    list: ChatHistoryItem[]
+    total: number
+  }
+}
+
+/**
+ * 历史会话记录项接口
+ */
+export interface ChatRecordItem {
+  _id: string
+  dataId: string
+  hideInUI: boolean
+  obj: 'Human' | 'AI'
+  value: Array<{
+    type: string
+    text: {
+      content: string
+    }
+  }>
+  customFeedbacks: any[]
+  time: string
+  durationSeconds?: number
+  llmModuleAccount?: number
+  totalQuoteList?: any[]
+  historyPreviewLength?: number
+  [key: string]: any
+}
+
+/**
+ * 获取历史会话记录请求参数接口
+ */
+export interface GetPaginationRecordsRequest {
+  appId: string
+  chatId: string
+  offset: number
+  pageSize: number
+  loadCustomFeedbacks: boolean
+}
+
+/**
+ * 获取历史会话记录响应接口
+ */
+export interface GetPaginationRecordsResponse {
+  code: number
+  statusText: string
+  message: string
+  data: {
+    list: ChatRecordItem[]
+    total: number
+  }
+}
+
+// ==================== MateChat 组件内部类型 ====================
+
+/**
+ * MateChat 组件内部使用的消息结构
+ */
+export interface MateChatMessage {
+  from: 'user' | 'model' | 'service'
+  content: string
+  loading?: boolean
+}