@leatop/ai-agent-iframe 3.0.0 → 3.0.1
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/LICENSE +21 -21
- package/README.md +101 -0
- package/dist/ai-agent-iframe.cjs +8 -0
- package/dist/ai-agent-iframe.mjs +1614 -0
- package/dist/index-dialog.vue.d.ts +69 -0
- package/dist/index.d.ts +2 -0
- package/dist/index.vue.d.ts +114 -0
- package/dist/style.css +1 -0
- package/dist/utils/auth.d.ts +6 -0
- package/package.json +58 -15
- package/index.js +0 -1
package/LICENSE
CHANGED
|
@@ -1,21 +1,21 @@
|
|
|
1
|
-
MIT License
|
|
2
|
-
|
|
3
|
-
Copyright (c) 2026 Lollipope
|
|
4
|
-
|
|
5
|
-
Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
6
|
-
of this software and associated documentation files (the "Software"), to deal
|
|
7
|
-
in the Software without restriction, including without limitation the rights
|
|
8
|
-
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
9
|
-
copies of the Software, and to permit persons to whom the Software is
|
|
10
|
-
furnished to do so, subject to the following conditions:
|
|
11
|
-
|
|
12
|
-
The above copyright notice and this permission notice shall be included in all
|
|
13
|
-
copies or substantial portions of the Software.
|
|
14
|
-
|
|
15
|
-
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
16
|
-
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
17
|
-
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
18
|
-
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
19
|
-
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
20
|
-
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
21
|
-
SOFTWARE.
|
|
1
|
+
MIT License
|
|
2
|
+
|
|
3
|
+
Copyright (c) 2026 Lollipope
|
|
4
|
+
|
|
5
|
+
Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
6
|
+
of this software and associated documentation files (the "Software"), to deal
|
|
7
|
+
in the Software without restriction, including without limitation the rights
|
|
8
|
+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
9
|
+
copies of the Software, and to permit persons to whom the Software is
|
|
10
|
+
furnished to do so, subject to the following conditions:
|
|
11
|
+
|
|
12
|
+
The above copyright notice and this permission notice shall be included in all
|
|
13
|
+
copies or substantial portions of the Software.
|
|
14
|
+
|
|
15
|
+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
16
|
+
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
17
|
+
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
18
|
+
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
19
|
+
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
20
|
+
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
21
|
+
SOFTWARE.
|
package/README.md
ADDED
|
@@ -0,0 +1,101 @@
|
|
|
1
|
+
# @leatop/ai-agent-iframe
|
|
2
|
+
|
|
3
|
+
Leatop CDP AI Agent 的 **iframe 轻量版**悬浮入口组件。
|
|
4
|
+
只负责「悬浮机器人图标 + 全屏/半屏 iframe 容器 + 与子应用 postMessage 通信」,不含本地对话渲染逻辑,包体很小。
|
|
5
|
+
|
|
6
|
+
## 1. 安装
|
|
7
|
+
|
|
8
|
+
```bash
|
|
9
|
+
pnpm add @leatop/ai-agent-iframe
|
|
10
|
+
```
|
|
11
|
+
|
|
12
|
+
|
|
13
|
+
|
|
14
|
+
- `vue` `^3.5`
|
|
15
|
+
- `element-plus` `^2.11`(组件内部使用了 `el-icon` / `el-tag`,**需宿主全局注册 Element Plus**:`app.use(ElementPlus)`)
|
|
16
|
+
- `axios` `^1.6`、`qs` `^6.12`(内部请求封装使用)
|
|
17
|
+
|
|
18
|
+
## 2. 运行时配置
|
|
19
|
+
|
|
20
|
+
组件初始化时读取 `window.globalConfig`,请在被引入前注入(例如 `public/config.js`):
|
|
21
|
+
|
|
22
|
+
```js
|
|
23
|
+
window.globalConfig = {
|
|
24
|
+
// 生成 ticket 的接口前缀(不配则默认 '/api/')
|
|
25
|
+
AiAgentApi: '/yyjc/api/',
|
|
26
|
+
// true:从 cookie 取 token;false/不配:从 localStorage 取 'cdp-token'
|
|
27
|
+
sessionCookie: true,
|
|
28
|
+
};
|
|
29
|
+
```
|
|
30
|
+
|
|
31
|
+
## 3. 在页面中使用
|
|
32
|
+
|
|
33
|
+
```ts
|
|
34
|
+
// main.ts / 项目入口:引入组件样式(只需一次)
|
|
35
|
+
import '@leatop/ai-agent-iframe/style.css';
|
|
36
|
+
```
|
|
37
|
+
|
|
38
|
+
```vue
|
|
39
|
+
<script setup>
|
|
40
|
+
// 推荐:局部注册(与 @leatop/ai-agent 的用法一致)
|
|
41
|
+
import AIagent from '@leatop/ai-agent-iframe';
|
|
42
|
+
</script>
|
|
43
|
+
|
|
44
|
+
<template>
|
|
45
|
+
<!-- 建议放在 NavBar 右侧,父容器 z-index 需高于导航 -->
|
|
46
|
+
<AIagent
|
|
47
|
+
v-if="showAiagent"
|
|
48
|
+
:ai-iframe-src="aiIframeSrc"
|
|
49
|
+
:login-key="loginKey"
|
|
50
|
+
:user-info="userInfo"
|
|
51
|
+
@openTab="onOpenTab"
|
|
52
|
+
@openAI="onOpenAI"
|
|
53
|
+
@child-message="onChildMessage"
|
|
54
|
+
/>
|
|
55
|
+
</template>
|
|
56
|
+
```
|
|
57
|
+
|
|
58
|
+
如果想全局注册(`app.use(AIagent)`),组件名是 `AiagentBox`,模板中需写成 `<AiagentBox />`。
|
|
59
|
+
|
|
60
|
+
## 4. Props
|
|
61
|
+
|
|
62
|
+
| 名称 | 类型 | 默认值 | 说明 |
|
|
63
|
+
| --- | --- | --- | --- |
|
|
64
|
+
| `aiIframeSrc` | `string` | `''` | 子应用地址 **origin**(如 `https://ai.example.com`),同时用于 `postMessage` 的 `targetOrigin` 校验 |
|
|
65
|
+
| `loginKey` | `string` | `''` | 调用 `/odm/openApi/generateToken` 换取 ticket 的凭证 |
|
|
66
|
+
| `userInfo` | `object` | `{}` | 用户信息,握手后通过 `postMessage` 推给子应用 |
|
|
67
|
+
|
|
68
|
+
## 5. Events
|
|
69
|
+
|
|
70
|
+
| 名称 | 参数 | 说明 |
|
|
71
|
+
| --- | --- | --- |
|
|
72
|
+
| `openTab` | `tabId: number` | 点击「AI通问 / AI问策 / AI问数」菜单项,`0/1/2` |
|
|
73
|
+
| `openAI` | — | 点击悬浮机器人图标 |
|
|
74
|
+
| `child-message` | `data: any` | 子应用 `postMessage` 上抛的消息 |
|
|
75
|
+
|
|
76
|
+
## 6. iframe 通信协议
|
|
77
|
+
|
|
78
|
+
父页面 → 子页面(`window.postMessage(payload, aiIframeSrc)`):
|
|
79
|
+
|
|
80
|
+
```ts
|
|
81
|
+
{ userId: 123, tab: 'home', filters: { status: 'all' }, tabId?: number }
|
|
82
|
+
```
|
|
83
|
+
|
|
84
|
+
子页面就绪后需向父页面发送:
|
|
85
|
+
|
|
86
|
+
```ts
|
|
87
|
+
window.parent.postMessage({ type: 'CHILD_READY' }, parentOrigin);
|
|
88
|
+
```
|
|
89
|
+
|
|
90
|
+
父页面收到 `CHILD_READY` 后才会全量同步一次参数;`tabId` 变化时也会增量推送,且**不会重载 iframe**。
|
|
91
|
+
|
|
92
|
+
## 7. 开发 / 构建
|
|
93
|
+
|
|
94
|
+
```bash
|
|
95
|
+
pnpm dev # 本地调试
|
|
96
|
+
pnpm build # 产出 dist/ai-agent-iframe.mjs、ai-agent-iframe.cjs、index.d.ts、style.css
|
|
97
|
+
pnpm type-check # 类型检查
|
|
98
|
+
```
|
|
99
|
+
|
|
100
|
+
> 发布必须使用 `pnpm publish`:入口 `main/module/types/exports` 在发布时由 `publishConfig` 覆盖为 `dist/`,
|
|
101
|
+
> 该覆盖能力仅 pnpm 支持,`scripts/prepack-check.mjs` 会在 `prepack` 阶段校验。
|