gimc-ai-agent 1.0.27 → 1.0.29
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +146 -6
- package/dist/gimc-ai-agent.es.js +2799 -2790
- package/dist/gimc-ai-agent.umd.js +30 -30
- package/dist/style.css +1 -1
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -2,6 +2,8 @@
|
|
|
2
2
|
|
|
3
3
|
AI 智能客服 Vue3 组件,基于 RAG 知识库的智能问答系统。
|
|
4
4
|
|
|
5
|
+
当前版本:1.0.27
|
|
6
|
+
|
|
5
7
|
## 安装
|
|
6
8
|
|
|
7
9
|
### 1. 安装组件
|
|
@@ -55,7 +57,47 @@ app.use(ElementPlus)
|
|
|
55
57
|
app.mount('#app')
|
|
56
58
|
```
|
|
57
59
|
|
|
58
|
-
### 4.
|
|
60
|
+
### 4. 配置环境(可选)
|
|
61
|
+
|
|
62
|
+
组件默认使用生产环境配置。有两种方式配置环境:
|
|
63
|
+
|
|
64
|
+
**方式1:通过 prop 传递(推荐)**
|
|
65
|
+
|
|
66
|
+
```vue
|
|
67
|
+
<template>
|
|
68
|
+
<gimc-ai-agent
|
|
69
|
+
:rag-knowledge-id="1"
|
|
70
|
+
:token="token"
|
|
71
|
+
:environment="env"
|
|
72
|
+
/>
|
|
73
|
+
</template>
|
|
74
|
+
|
|
75
|
+
<script setup>
|
|
76
|
+
import { computed } from 'vue'
|
|
77
|
+
|
|
78
|
+
// 根据环境变量自动切换
|
|
79
|
+
const env = computed(() => import.meta.env.MODE)
|
|
80
|
+
</script>
|
|
81
|
+
```
|
|
82
|
+
|
|
83
|
+
**方式2:全局配置**
|
|
84
|
+
|
|
85
|
+
```typescript
|
|
86
|
+
// main.ts
|
|
87
|
+
import { envConfigManager } from 'gimc-ai-agent'
|
|
88
|
+
|
|
89
|
+
// 设置为开发环境
|
|
90
|
+
envConfigManager.setEnvironment('development')
|
|
91
|
+
|
|
92
|
+
// 或根据环境变量自动切换
|
|
93
|
+
if (import.meta.env.DEV) {
|
|
94
|
+
envConfigManager.setEnvironment('development')
|
|
95
|
+
}
|
|
96
|
+
```
|
|
97
|
+
|
|
98
|
+
> **注意**:如果同时使用两种方式,prop 方式的优先级更高,会覆盖全局配置。
|
|
99
|
+
|
|
100
|
+
### 5. 在组件中使用
|
|
59
101
|
|
|
60
102
|
```vue
|
|
61
103
|
<template>
|
|
@@ -64,18 +106,19 @@ app.mount('#app')
|
|
|
64
106
|
v-if="isLoggedIn"
|
|
65
107
|
:rag-knowledge-id="1"
|
|
66
108
|
:token="token"
|
|
109
|
+
:environment="environment"
|
|
67
110
|
/>
|
|
68
111
|
</template>
|
|
69
112
|
|
|
70
113
|
<script setup lang="ts">
|
|
71
114
|
import { ref, computed } from 'vue'
|
|
72
|
-
import { GimcAiAgent } from 'gimc-ai-agent'
|
|
115
|
+
import { GimcAiAgent, type FeedbackData } from 'gimc-ai-agent'
|
|
73
116
|
|
|
74
117
|
const agentRef = ref()
|
|
75
118
|
|
|
76
119
|
// 登录状态判断(根据实际业务修改)
|
|
77
120
|
const token = computed(() => localStorage.getItem('token') || '')
|
|
78
|
-
const isLoggedIn = computed(() => !!
|
|
121
|
+
const isLoggedIn = computed(() => !!token.value)
|
|
79
122
|
|
|
80
123
|
// 事件监听
|
|
81
124
|
const onSend = (msg: string) => {
|
|
@@ -104,10 +147,17 @@ const clearMessages = () => agentRef.value?.clearMessages()
|
|
|
104
147
|
|------|------|--------|------|------|
|
|
105
148
|
| `ragKnowledgeId` | `number` | - | ✅ | RAG 知识库 ID |
|
|
106
149
|
| `token` | `string` | - | ✅ | 外部系统传入的认证 token(优先级高于 localStorage) |
|
|
150
|
+
| `environment` | `'development' \| 'production'` | `'production'` | ✅ | 环境标识(推荐通过 prop 传递,也可通过 envConfigManager 全局设置) |
|
|
107
151
|
| `title` | `string` | `'灵犀AI小助手'` | - | 标题 |
|
|
108
|
-
| `
|
|
152
|
+
| `avatar` | `string` | - | - | 头像 URL |
|
|
153
|
+
| `floatIcon` | `string` | - | - | 悬浮按钮图标 URL |
|
|
154
|
+
| `position` | `{ right?: number; bottom?: number }` | - | - | 位置配置 |
|
|
155
|
+
| `width` | `number` | `560` | - | 弹窗宽度(px) |
|
|
156
|
+
| `welcomeText` | `string` | `'灵犀AI小助手已全新上线...'` | - | 欢迎语 |
|
|
109
157
|
| `idleTimeout` | `number` | `180000` | - | 空闲超时时间(ms) |
|
|
110
|
-
| `typingSpeed` | `number` | `
|
|
158
|
+
| `typingSpeed` | `number` | `5` | - | 打字机速度(ms) |
|
|
159
|
+
| `showSatisfaction` | `boolean` | `true` | - | 是否显示满意度评价 |
|
|
160
|
+
| `showFeedback` | `boolean` | `true` | - | 是否显示反馈功能 |
|
|
111
161
|
|
|
112
162
|
## Events
|
|
113
163
|
|
|
@@ -208,15 +258,89 @@ localStorage.setItem('gimc-ai-agent-token', 'your-token-here')
|
|
|
208
258
|
- 如果同时存在 `token` prop 和 localStorage 中的 token,优先使用 `token` prop
|
|
209
259
|
- 这样可以确保外部系统集成时的灵活性
|
|
210
260
|
|
|
261
|
+
## 环境配置 API
|
|
262
|
+
|
|
263
|
+
组件提供了环境配置管理器 `envConfigManager`,用于切换开发/生产环境:
|
|
264
|
+
|
|
265
|
+
```typescript
|
|
266
|
+
import { envConfigManager } from 'gimc-ai-agent'
|
|
267
|
+
|
|
268
|
+
// 设置环境
|
|
269
|
+
envConfigManager.setEnvironment('development') // 或 'production'
|
|
270
|
+
|
|
271
|
+
// 获取当前环境
|
|
272
|
+
const env = envConfigManager.getEnvironment()
|
|
273
|
+
|
|
274
|
+
// 获取完整配置
|
|
275
|
+
const config = envConfigManager.getConfig()
|
|
276
|
+
|
|
277
|
+
// 获取具体配置项
|
|
278
|
+
const apiUrl = envConfigManager.getApiUrl()
|
|
279
|
+
const projectName = envConfigManager.getProjectName()
|
|
280
|
+
const tokenName = envConfigManager.getTokenName()
|
|
281
|
+
```
|
|
282
|
+
|
|
283
|
+
### 环境配置说明
|
|
284
|
+
|
|
285
|
+
| 环境 | API URL | 项目名称 | Token 名称 |
|
|
286
|
+
|------|---------|----------|-----------|
|
|
287
|
+
| development | `http://dev-api.gw.gimccloud.com:32619/lxai-web-api` | 省广智能客服 | gimc-ai-agent |
|
|
288
|
+
| production | `https://api.gimccloud.com/lxai-web-api/` | 灵犀AI后台管理 | gimc-lxai-admin-front |
|
|
289
|
+
|
|
211
290
|
## RAG 知识库配置
|
|
212
291
|
|
|
213
292
|
本组件需要配合 RAG 知识库后端使用。确保:
|
|
214
293
|
|
|
215
294
|
1. 后端已部署 RAG 知识库服务
|
|
216
295
|
2. 创建知识库并获取 `ragKnowledgeId`
|
|
217
|
-
3.
|
|
296
|
+
3. 配置好环境(通过 `envConfigManager` 设置)
|
|
218
297
|
4. 确保用户已通过认证(提供有效的 token)
|
|
219
298
|
|
|
299
|
+
## 导出内容
|
|
300
|
+
|
|
301
|
+
组件提供以下导出内容:
|
|
302
|
+
|
|
303
|
+
### 组件
|
|
304
|
+
```typescript
|
|
305
|
+
import { GimcAiAgent, AiAgent } from 'gimc-ai-agent'
|
|
306
|
+
// GimcAiAgent 和 AiAgent 是同一个组件的两个导出名称
|
|
307
|
+
```
|
|
308
|
+
|
|
309
|
+
### 类型定义
|
|
310
|
+
```typescript
|
|
311
|
+
import type {
|
|
312
|
+
Message, // 消息类型
|
|
313
|
+
Article, // 文章类型
|
|
314
|
+
QuickAction, // 快捷操作类型
|
|
315
|
+
AiResponse, // AI 响应类型
|
|
316
|
+
FeedbackData, // 反馈数据类型
|
|
317
|
+
Position, // 位置配置
|
|
318
|
+
SatisfactionOption,// 满意度选项
|
|
319
|
+
FeedbackTypeOption,// 反馈类型选项
|
|
320
|
+
Environment, // 环境类型
|
|
321
|
+
ApiConfig // API 配置接口
|
|
322
|
+
} from 'gimc-ai-agent'
|
|
323
|
+
```
|
|
324
|
+
|
|
325
|
+
### 工具和配置
|
|
326
|
+
```typescript
|
|
327
|
+
import {
|
|
328
|
+
envConfigManager, // 环境配置管理器
|
|
329
|
+
defaultFloatIcon, // 默认悬浮按钮图标
|
|
330
|
+
defaultAvatarIcon // 默认头像图标
|
|
331
|
+
} from 'gimc-ai-agent'
|
|
332
|
+
```
|
|
333
|
+
|
|
334
|
+
### Vue 插件方式使用
|
|
335
|
+
```typescript
|
|
336
|
+
// main.ts
|
|
337
|
+
import { createApp } from 'vue'
|
|
338
|
+
import GimcAiAgentPlugin from 'gimc-ai-agent'
|
|
339
|
+
|
|
340
|
+
const app = createApp(App)
|
|
341
|
+
app.use(GimcAiAgentPlugin) // 全局注册为 GimcAiAgent
|
|
342
|
+
```
|
|
343
|
+
|
|
220
344
|
## 自定义插槽示例
|
|
221
345
|
|
|
222
346
|
```vue
|
|
@@ -236,6 +360,22 @@ localStorage.setItem('gimc-ai-agent-token', 'your-token-here')
|
|
|
236
360
|
</gimc-ai-agent>
|
|
237
361
|
```
|
|
238
362
|
|
|
363
|
+
## 依赖说明
|
|
364
|
+
|
|
365
|
+
### 核心依赖
|
|
366
|
+
- `axios`: ^1.13.2 - HTTP 请求库
|
|
367
|
+
- `dompurify`: 3.3.1 - HTML 内容安全过滤
|
|
368
|
+
- `highlight.js`: ^11.11.1 - 代码高亮
|
|
369
|
+
- `marked`: ^5.1.2 - Markdown 解析
|
|
370
|
+
|
|
371
|
+
### 对等依赖(需要项目安装)
|
|
372
|
+
- `vue`: ^3.3.0
|
|
373
|
+
- `element-plus`: ^2.0.0
|
|
374
|
+
- `@element-plus/icons-vue`: ^2.0.0
|
|
375
|
+
|
|
376
|
+
### Node 版本要求
|
|
377
|
+
- Node.js >= 16.0.0
|
|
378
|
+
|
|
239
379
|
## License
|
|
240
380
|
|
|
241
381
|
MIT
|