@veltra/ai 2.1.2 → 2.1.4
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/dist/chat/index.d.ts +2 -2
- package/dist/chat/transports/openai.js +52 -6
- package/dist/chat/transports/openai.js.map +1 -1
- package/dist/chat/types.d.ts +31 -1
- package/dist/chat/use-chat.d.ts +31 -1
- package/dist/chat/use-chat.js +33 -1
- package/dist/chat/use-chat.js.map +1 -1
- package/dist/components/ai-chat/ai-chat.js +17 -4
- package/dist/components/ai-chat/ai-chat.js.map +1 -1
- package/dist/components/ai-chat/chat-input.js +75 -20
- package/dist/components/ai-chat/chat-input.js.map +1 -1
- package/dist/components/ai-chat/message-item.js +1 -6
- package/dist/components/ai-chat/message-item.js.map +1 -1
- package/dist/components/ai-chat/message-list.js +15 -0
- package/dist/components/ai-chat/message-list.js.map +1 -1
- package/dist/components/ai-chat/style.d.ts +1 -0
- package/dist/components/ai-chat/style.js +1 -0
- package/dist/components/ai-chat/style2.css +38 -11
- package/dist/index.d.ts +2 -2
- package/dist/types/ai-chat.d.ts +11 -2
- package/package.json +5 -5
- package/src/chat/__test__/use-chat.test.ts +67 -0
- package/src/chat/transports/__test__/openai.test.ts +140 -0
- package/src/chat/transports/openai.ts +73 -7
- package/src/chat/types.ts +31 -0
- package/src/chat/use-chat.ts +39 -1
- package/src/components/ai-chat/__test__/ai-chat.test.ts +121 -1
- package/src/components/ai-chat/ai-chat.vue +13 -0
- package/src/components/ai-chat/chat-input.vue +64 -3
- package/src/components/ai-chat/message-item.vue +0 -1
- package/src/components/ai-chat/message-list.vue +22 -0
- package/src/components/ai-chat/style.scss +50 -15
- package/src/components/ai-chat/style.ts +1 -0
- package/src/types/ai-chat.ts +11 -1
|
@@ -1,12 +1,13 @@
|
|
|
1
1
|
import { AiChatDIKey } from "./di.js";
|
|
2
2
|
import _sfc_main$1 from "./model-picker.js";
|
|
3
|
-
import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createVNode, defineComponent, inject, mergeModels, nextTick, normalizeClass, openBlock, ref, renderList, shallowRef, unref, useModel, vModelText, withCtx, withDirectives, withKeys, withModifiers } from "vue";
|
|
4
|
-
import { Attach, Close, Up } from "@veltra/icons/normal";
|
|
5
|
-
import { UButton, UFilePicker, UIcon } from "@veltra/desktop";
|
|
3
|
+
import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createVNode, defineComponent, inject, mergeModels, nextTick, normalizeClass, openBlock, ref, renderList, shallowRef, toDisplayString, unref, useModel, vModelText, withCtx, withDirectives, withKeys, withModifiers } from "vue";
|
|
4
|
+
import { Attach, Clear, Close, Up } from "@veltra/icons/normal";
|
|
5
|
+
import { UButton, UFilePicker, UIcon, UPopConfirm } from "@veltra/desktop";
|
|
6
6
|
import { bem } from "@veltra/utils";
|
|
7
7
|
//#region src/components/ai-chat/chat-input.vue
|
|
8
8
|
const _hoisted_1 = ["src", "alt"];
|
|
9
9
|
const _hoisted_2 = ["placeholder", "onKeydown"];
|
|
10
|
+
const _hoisted_3 = ["title"];
|
|
10
11
|
const _sfc_main = /*@__PURE__*/ defineComponent({
|
|
11
12
|
name: "UAiChatInput",
|
|
12
13
|
__name: "chat-input",
|
|
@@ -15,14 +16,21 @@ const _sfc_main = /*@__PURE__*/ defineComponent({
|
|
|
15
16
|
models: {},
|
|
16
17
|
placeholder: {},
|
|
17
18
|
accept: {},
|
|
18
|
-
maxAttachmentSize: {}
|
|
19
|
+
maxAttachmentSize: {},
|
|
20
|
+
clearable: { type: Boolean },
|
|
21
|
+
tokenUsage: {},
|
|
22
|
+
tokenUsageDetail: { type: Boolean }
|
|
19
23
|
}, {
|
|
20
24
|
"model": {},
|
|
21
25
|
"modelModifiers": {},
|
|
22
26
|
"reasoningLevel": {},
|
|
23
27
|
"reasoningLevelModifiers": {}
|
|
24
28
|
}),
|
|
25
|
-
emits: /*@__PURE__*/ mergeModels([
|
|
29
|
+
emits: /*@__PURE__*/ mergeModels([
|
|
30
|
+
"send",
|
|
31
|
+
"abort",
|
|
32
|
+
"clear"
|
|
33
|
+
], ["update:model", "update:reasoningLevel"]),
|
|
26
34
|
setup(__props, { expose: __expose, emit: __emit }) {
|
|
27
35
|
const props = __props;
|
|
28
36
|
const model = useModel(__props, "model");
|
|
@@ -35,6 +43,30 @@ const _sfc_main = /*@__PURE__*/ defineComponent({
|
|
|
35
43
|
const hasContent = computed(() => !!text.value.trim() || attachments.value.length > 0);
|
|
36
44
|
/** 生成中且输入为空时显示停止;有内容则显示发送(入队) */
|
|
37
45
|
const showStop = computed(() => props.running && !hasContent.value);
|
|
46
|
+
/**
|
|
47
|
+
* 用量数字:不到 1000 原样;≥1000 用 K;≥100 万用 M。
|
|
48
|
+
* 最多 1 位小数,整数不写 `.0`(1000 → 1K,1500 → 1.5K)。
|
|
49
|
+
*/
|
|
50
|
+
const formatTokenCount = (n) => {
|
|
51
|
+
const scaled = (value, unit) => {
|
|
52
|
+
const rounded = Math.round(value * 10) / 10;
|
|
53
|
+
return `${Number.isInteger(rounded) ? String(rounded) : rounded.toFixed(1)}${unit}`;
|
|
54
|
+
};
|
|
55
|
+
if (n < 1e3) return String(n);
|
|
56
|
+
if (n < 1e6) return Math.round(n / 1e3 * 10) / 10 >= 1e3 ? scaled(n / 1e6, "M") : scaled(n / 1e3, "K");
|
|
57
|
+
return scaled(n / 1e6, "M");
|
|
58
|
+
};
|
|
59
|
+
/** 会话累计:总 token;明细再拼有数据的缓存项,缺字段不写 0 */
|
|
60
|
+
const usageText = computed(() => {
|
|
61
|
+
const usage = props.tokenUsage;
|
|
62
|
+
if (!usage) return "";
|
|
63
|
+
const parts = [`总 token ${formatTokenCount(usage.totalTokens)}`];
|
|
64
|
+
if (props.tokenUsageDetail) {
|
|
65
|
+
if (usage.cacheHitTokens != null) parts.push(`缓存命中 ${formatTokenCount(usage.cacheHitTokens)}`);
|
|
66
|
+
if (usage.cacheMissTokens != null) parts.push(`缓存未命中 ${formatTokenCount(usage.cacheMissTokens)}`);
|
|
67
|
+
}
|
|
68
|
+
return parts.join(" · ");
|
|
69
|
+
});
|
|
38
70
|
/** 生成中提示用户消息将进入队列 */
|
|
39
71
|
const placeholderText = computed(() => {
|
|
40
72
|
if (props.running) return "会话进行中,发送的消息将进入待发送队列";
|
|
@@ -119,27 +151,50 @@ const _sfc_main = /*@__PURE__*/ defineComponent({
|
|
|
119
151
|
onInput: autoResize
|
|
120
152
|
}, null, 42, _hoisted_2), [[vModelText, text.value]]),
|
|
121
153
|
createElementVNode("div", { class: normalizeClass(unref(cls).e("input-toolbar")) }, [
|
|
122
|
-
createElementVNode("div", { class: normalizeClass(unref(cls).e("input-toolbar-left")) }, [
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
default: withCtx(() => [createVNode(unref(UIcon), {
|
|
128
|
-
class: normalizeClass(unref(cls).e("input-attach")),
|
|
129
|
-
title: "添加图片"
|
|
154
|
+
createElementVNode("div", { class: normalizeClass(unref(cls).e("input-toolbar-left")) }, [
|
|
155
|
+
createVNode(unref(UFilePicker), {
|
|
156
|
+
multiple: "",
|
|
157
|
+
accept: __props.accept ?? "image/*",
|
|
158
|
+
onPick: handlePick
|
|
130
159
|
}, {
|
|
131
|
-
default: withCtx(() => [createVNode(unref(
|
|
160
|
+
default: withCtx(() => [createVNode(unref(UIcon), {
|
|
161
|
+
class: normalizeClass(unref(cls).e("input-attach")),
|
|
162
|
+
title: "添加图片"
|
|
163
|
+
}, {
|
|
164
|
+
default: withCtx(() => [createVNode(unref(Attach))]),
|
|
165
|
+
_: 1
|
|
166
|
+
}, 8, ["class"])]),
|
|
132
167
|
_: 1
|
|
133
|
-
}, 8, ["
|
|
134
|
-
|
|
135
|
-
|
|
168
|
+
}, 8, ["accept"]),
|
|
169
|
+
createElementVNode("span", { class: normalizeClass([unref(cls).e("input-clear-wrap"), unref(bem).is("disabled", !__props.clearable)]) }, [createVNode(unref(UPopConfirm), {
|
|
170
|
+
title: "清空当前对话?进行中的生成将被中止。",
|
|
171
|
+
"confirm-text": "清空",
|
|
172
|
+
direction: "top",
|
|
173
|
+
alignment: "start",
|
|
174
|
+
onConfirm: _cache[1] || (_cache[1] = ($event) => emit("clear"))
|
|
175
|
+
}, {
|
|
176
|
+
reference: withCtx(() => [createVNode(unref(UIcon), {
|
|
177
|
+
class: normalizeClass(unref(cls).e("input-clear")),
|
|
178
|
+
title: "清除会话"
|
|
179
|
+
}, {
|
|
180
|
+
default: withCtx(() => [createVNode(unref(Clear))]),
|
|
181
|
+
_: 1
|
|
182
|
+
}, 8, ["class"])]),
|
|
183
|
+
_: 1
|
|
184
|
+
})], 2),
|
|
185
|
+
__props.tokenUsage ? (openBlock(), createElementBlock("span", {
|
|
186
|
+
key: 0,
|
|
187
|
+
class: normalizeClass(unref(cls).e("input-usage")),
|
|
188
|
+
title: usageText.value
|
|
189
|
+
}, toDisplayString(usageText.value), 11, _hoisted_3)) : createCommentVNode("v-if", true)
|
|
190
|
+
], 2),
|
|
136
191
|
createCommentVNode(" 右簇:模型/推理选择 → 发送或停止(互斥) "),
|
|
137
192
|
createElementVNode("div", { class: normalizeClass(unref(cls).e("input-toolbar-right")) }, [__props.models?.length ? (openBlock(), createBlock(_sfc_main$1, {
|
|
138
193
|
key: 0,
|
|
139
194
|
model: model.value,
|
|
140
|
-
"onUpdate:model": _cache[
|
|
195
|
+
"onUpdate:model": _cache[2] || (_cache[2] = ($event) => model.value = $event),
|
|
141
196
|
"reasoning-level": reasoningLevel.value,
|
|
142
|
-
"onUpdate:reasoningLevel": _cache[
|
|
197
|
+
"onUpdate:reasoningLevel": _cache[3] || (_cache[3] = ($event) => reasoningLevel.value = $event),
|
|
143
198
|
models: __props.models
|
|
144
199
|
}, null, 8, [
|
|
145
200
|
"model",
|
|
@@ -151,7 +206,7 @@ const _sfc_main = /*@__PURE__*/ defineComponent({
|
|
|
151
206
|
type: "danger",
|
|
152
207
|
circle: "",
|
|
153
208
|
title: "停止生成",
|
|
154
|
-
onClick: _cache[
|
|
209
|
+
onClick: _cache[4] || (_cache[4] = ($event) => emit("abort"))
|
|
155
210
|
}, {
|
|
156
211
|
default: withCtx(() => [createElementVNode("span", { class: normalizeClass(unref(cls).e("input-stop")) }, null, 2)]),
|
|
157
212
|
_: 1
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"chat-input.js","names":[],"sources":["../../../src/components/ai-chat/chat-input.vue"],"sourcesContent":["<template>\n <div :class=\"cls.e('input-area')\">\n <div v-if=\"attachments.length\" :class=\"cls.e('input-attachments')\">\n <div\n v-for=\"(att, index) in attachments\"\n :key=\"att.dataUrl\"\n :class=\"cls.e('input-attachment')\"\n >\n <img :src=\"att.dataUrl\" :alt=\"att.name\" />\n <UIcon :class=\"cls.e('input-attachment-remove')\" @click=\"attachments.splice(index, 1)\">\n <Close />\n </UIcon>\n </div>\n </div>\n\n <textarea\n ref=\"textareaRef\"\n v-model=\"text\"\n :class=\"cls.e('input')\"\n :placeholder=\"placeholderText\"\n rows=\"1\"\n @keydown.enter.exact.prevent=\"handleSend\"\n @input=\"autoResize\"\n />\n\n <div :class=\"cls.e('input-toolbar')\">\n <div :class=\"cls.e('input-toolbar-left')\">\n <UFilePicker multiple :accept=\"accept ?? 'image/*'\" @pick=\"handlePick\">\n <UIcon :class=\"cls.e('input-attach')\" title=\"添加图片\">\n <Attach />\n </UIcon>\n </UFilePicker>\n </div>\n\n <!-- 右簇:模型/推理选择 → 发送或停止(互斥) -->\n <div :class=\"cls.e('input-toolbar-right')\">\n <ModelPicker\n v-if=\"models?.length\"\n v-model:model=\"model\"\n v-model:reasoning-level=\"reasoningLevel\"\n :models=\"models\"\n />\n\n <UButton\n v-if=\"showStop\"\n key=\"stop\"\n size=\"small\"\n type=\"danger\"\n circle\n title=\"停止生成\"\n @click=\"emit('abort')\"\n >\n <span :class=\"cls.e('input-stop')\" />\n </UButton>\n <UButton\n v-else\n key=\"send\"\n size=\"small\"\n type=\"primary\"\n circle\n :disabled=\"!hasContent\"\n :icon=\"Up\"\n :title=\"running ? '加入待发送队列' : undefined\"\n @click=\"handleSend\"\n />\n </div>\n </div>\n </div>\n</template>\n\n<script lang=\"ts\" setup>\nimport { UButton, UFilePicker, UIcon } from '@veltra/desktop'\nimport { Attach, Close, Up } from '@veltra/icons/normal'\nimport { bem } from '@veltra/utils'\nimport { computed, inject, nextTick, ref, shallowRef } from 'vue'\n\nimport type { ChatAttachment } from '../../chat/types'\nimport type { ChatModelOption } from '../../providers'\nimport { AiChatDIKey } from './di'\nimport ModelPicker from './model-picker.vue'\n\ndefineOptions({ name: 'UAiChatInput' })\n\nconst props = defineProps<{\n /** 是否生成中(空输入显示停止,有内容则发送入队) */\n running: boolean\n /** 可选模型列表;有值则显示选择器 */\n models?: ChatModelOption[]\n /** 输入框占位文本 */\n placeholder?: string\n /** 附件 accept 类型 */\n accept?: string\n /** 单个附件最大字节数 */\n maxAttachmentSize?: number\n}>()\n\nconst model = defineModel<string>('model')\nconst reasoningLevel = defineModel<string>('reasoningLevel')\n\nconst emit = defineEmits<{\n (e: 'send', content: string, attachments: ChatAttachment[]): void\n (e: 'abort'): void\n}>()\n\nconst di = inject(AiChatDIKey)\nconst cls = di?.cls ?? bem('ai-chat')\n\nconst text = ref('')\nconst attachments = ref<ChatAttachment[]>([])\nconst textareaRef = shallowRef<HTMLTextAreaElement>()\n\nconst hasContent = computed(() => !!text.value.trim() || attachments.value.length > 0)\n\n/** 生成中且输入为空时显示停止;有内容则显示发送(入队) */\nconst showStop = computed(() => props.running && !hasContent.value)\n\n/** 生成中提示用户消息将进入队列 */\nconst placeholderText = computed(() => {\n if (props.running) return '会话进行中,发送的消息将进入待发送队列'\n return props.placeholder ?? '输入消息,Enter 发送,Shift + Enter 换行'\n})\n\n/** 多行自适应高度,上限 160px */\nconst autoResize = () => {\n const el = textareaRef.value\n if (!el) return\n el.style.height = 'auto'\n el.style.height = `${Math.min(el.scrollHeight, 160)}px`\n}\n\nconst handleSend = () => {\n if (!hasContent.value) return\n emit('send', text.value.trim(), attachments.value)\n text.value = ''\n attachments.value = []\n autoResize()\n}\n\n/** 取回内容到输入框(队列编辑场景),并聚焦 */\nconst setContent = (content: string) => {\n text.value = content\n void nextTick(() => {\n autoResize()\n textareaRef.value?.focus()\n })\n}\n\n/** 读取当前输入框内容 */\nconst getContent = () => text.value\n\ndefineExpose({ setContent, getContent })\n\n/** 将拾取的文件转为 dataUrl 附件(超限忽略) */\nconst handlePick = (files: File[]) => {\n const maxSize = props.maxAttachmentSize ?? 10 * 1024 * 1024\n\n for (const file of files) {\n if (file.size > maxSize) {\n console.warn(`[UAiChat] 附件 ${file.name} 超过大小限制,已忽略`)\n continue\n }\n const reader = new FileReader()\n reader.onload = () => {\n attachments.value.push({\n name: file.name,\n mimeType: file.type,\n size: file.size,\n dataUrl: String(reader.result)\n })\n }\n reader.readAsDataURL(file)\n }\n}\n</script>\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"chat-input.js","names":[],"sources":["../../../src/components/ai-chat/chat-input.vue"],"sourcesContent":["<template>\n <div :class=\"cls.e('input-area')\">\n <div v-if=\"attachments.length\" :class=\"cls.e('input-attachments')\">\n <div\n v-for=\"(att, index) in attachments\"\n :key=\"att.dataUrl\"\n :class=\"cls.e('input-attachment')\"\n >\n <img :src=\"att.dataUrl\" :alt=\"att.name\" />\n <UIcon :class=\"cls.e('input-attachment-remove')\" @click=\"attachments.splice(index, 1)\">\n <Close />\n </UIcon>\n </div>\n </div>\n\n <textarea\n ref=\"textareaRef\"\n v-model=\"text\"\n :class=\"cls.e('input')\"\n :placeholder=\"placeholderText\"\n rows=\"1\"\n @keydown.enter.exact.prevent=\"handleSend\"\n @input=\"autoResize\"\n />\n\n <div :class=\"cls.e('input-toolbar')\">\n <div :class=\"cls.e('input-toolbar-left')\">\n <UFilePicker multiple :accept=\"accept ?? 'image/*'\" @pick=\"handlePick\">\n <UIcon :class=\"cls.e('input-attach')\" title=\"添加图片\">\n <Attach />\n </UIcon>\n </UFilePicker>\n\n <span :class=\"[cls.e('input-clear-wrap'), bem.is('disabled', !clearable)]\">\n <UPopConfirm\n title=\"清空当前对话?进行中的生成将被中止。\"\n confirm-text=\"清空\"\n direction=\"top\"\n alignment=\"start\"\n @confirm=\"emit('clear')\"\n >\n <template #reference>\n <UIcon :class=\"cls.e('input-clear')\" title=\"清除会话\">\n <Clear />\n </UIcon>\n </template>\n </UPopConfirm>\n </span>\n\n <span v-if=\"tokenUsage\" :class=\"cls.e('input-usage')\" :title=\"usageText\">\n {{ usageText }}\n </span>\n </div>\n\n <!-- 右簇:模型/推理选择 → 发送或停止(互斥) -->\n <div :class=\"cls.e('input-toolbar-right')\">\n <ModelPicker\n v-if=\"models?.length\"\n v-model:model=\"model\"\n v-model:reasoning-level=\"reasoningLevel\"\n :models=\"models\"\n />\n\n <UButton\n v-if=\"showStop\"\n key=\"stop\"\n size=\"small\"\n type=\"danger\"\n circle\n title=\"停止生成\"\n @click=\"emit('abort')\"\n >\n <span :class=\"cls.e('input-stop')\" />\n </UButton>\n <UButton\n v-else\n key=\"send\"\n size=\"small\"\n type=\"primary\"\n circle\n :disabled=\"!hasContent\"\n :icon=\"Up\"\n :title=\"running ? '加入待发送队列' : undefined\"\n @click=\"handleSend\"\n />\n </div>\n </div>\n </div>\n</template>\n\n<script lang=\"ts\" setup>\nimport { UButton, UFilePicker, UIcon, UPopConfirm } from '@veltra/desktop'\nimport { Attach, Clear, Close, Up } from '@veltra/icons/normal'\nimport { bem } from '@veltra/utils'\nimport { computed, inject, nextTick, ref, shallowRef } from 'vue'\n\nimport type { ChatAttachment, ChatTokenUsage } from '../../chat/types'\nimport type { ChatModelOption } from '../../providers'\nimport { AiChatDIKey } from './di'\nimport ModelPicker from './model-picker.vue'\n\ndefineOptions({ name: 'UAiChatInput' })\n\nconst props = defineProps<{\n /** 是否生成中(空输入显示停止,有内容则发送入队) */\n running: boolean\n /** 可选模型列表;有值则显示选择器 */\n models?: ChatModelOption[]\n /** 输入框占位文本 */\n placeholder?: string\n /** 附件 accept 类型 */\n accept?: string\n /** 单个附件最大字节数 */\n maxAttachmentSize?: number\n /** 是否可清除(有消息 / 队列 / 生成中) */\n clearable?: boolean\n /** 会话累计 token;无 usage 时为 null,不展示 */\n tokenUsage?: ChatTokenUsage | null\n /** 是否展示缓存命中 / 未命中(默认只显示总 token) */\n tokenUsageDetail?: boolean\n}>()\n\nconst model = defineModel<string>('model')\nconst reasoningLevel = defineModel<string>('reasoningLevel')\n\nconst emit = defineEmits<{\n (e: 'send', content: string, attachments: ChatAttachment[]): void\n (e: 'abort'): void\n (e: 'clear'): void\n}>()\n\nconst di = inject(AiChatDIKey)\nconst cls = di?.cls ?? bem('ai-chat')\n\nconst text = ref('')\nconst attachments = ref<ChatAttachment[]>([])\nconst textareaRef = shallowRef<HTMLTextAreaElement>()\n\nconst hasContent = computed(() => !!text.value.trim() || attachments.value.length > 0)\n\n/** 生成中且输入为空时显示停止;有内容则显示发送(入队) */\nconst showStop = computed(() => props.running && !hasContent.value)\n\n/**\n * 用量数字:不到 1000 原样;≥1000 用 K;≥100 万用 M。\n * 最多 1 位小数,整数不写 `.0`(1000 → 1K,1500 → 1.5K)。\n */\nconst formatTokenCount = (n: number) => {\n const scaled = (value: number, unit: 'K' | 'M') => {\n const rounded = Math.round(value * 10) / 10\n return `${Number.isInteger(rounded) ? String(rounded) : rounded.toFixed(1)}${unit}`\n }\n if (n < 1000) return String(n)\n if (n < 1_000_000) {\n const k = Math.round((n / 1000) * 10) / 10\n // 四舍五入后会变成 1000K 时改用 M\n return k >= 1000 ? scaled(n / 1_000_000, 'M') : scaled(n / 1000, 'K')\n }\n return scaled(n / 1_000_000, 'M')\n}\n\n/** 会话累计:总 token;明细再拼有数据的缓存项,缺字段不写 0 */\nconst usageText = computed(() => {\n const usage = props.tokenUsage\n if (!usage) return ''\n const parts = [`总 token ${formatTokenCount(usage.totalTokens)}`]\n if (props.tokenUsageDetail) {\n if (usage.cacheHitTokens != null) {\n parts.push(`缓存命中 ${formatTokenCount(usage.cacheHitTokens)}`)\n }\n if (usage.cacheMissTokens != null) {\n parts.push(`缓存未命中 ${formatTokenCount(usage.cacheMissTokens)}`)\n }\n }\n return parts.join(' · ')\n})\n\n/** 生成中提示用户消息将进入队列 */\nconst placeholderText = computed(() => {\n if (props.running) return '会话进行中,发送的消息将进入待发送队列'\n return props.placeholder ?? '输入消息,Enter 发送,Shift + Enter 换行'\n})\n\n/** 多行自适应高度,上限 160px */\nconst autoResize = () => {\n const el = textareaRef.value\n if (!el) return\n el.style.height = 'auto'\n el.style.height = `${Math.min(el.scrollHeight, 160)}px`\n}\n\nconst handleSend = () => {\n if (!hasContent.value) return\n emit('send', text.value.trim(), attachments.value)\n text.value = ''\n attachments.value = []\n autoResize()\n}\n\n/** 取回内容到输入框(队列编辑场景),并聚焦 */\nconst setContent = (content: string) => {\n text.value = content\n void nextTick(() => {\n autoResize()\n textareaRef.value?.focus()\n })\n}\n\n/** 读取当前输入框内容 */\nconst getContent = () => text.value\n\ndefineExpose({ setContent, getContent })\n\n/** 将拾取的文件转为 dataUrl 附件(超限忽略) */\nconst handlePick = (files: File[]) => {\n const maxSize = props.maxAttachmentSize ?? 10 * 1024 * 1024\n\n for (const file of files) {\n if (file.size > maxSize) {\n console.warn(`[UAiChat] 附件 ${file.name} 超过大小限制,已忽略`)\n continue\n }\n const reader = new FileReader()\n reader.onload = () => {\n attachments.value.push({\n name: file.name,\n mimeType: file.type,\n size: file.size,\n dataUrl: String(reader.result)\n })\n }\n reader.readAsDataURL(file)\n }\n}\n</script>\n"],"mappings":"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"}
|
|
@@ -139,15 +139,10 @@ const _sfc_main = /*@__PURE__*/ defineComponent({
|
|
|
139
139
|
__props.message.content || isStreaming.value ? (openBlock(), createBlock(unref(MarkdownRender), mergeProps({
|
|
140
140
|
key: 1,
|
|
141
141
|
mode: "chat",
|
|
142
|
-
class: unref(cls).e("message-content"),
|
|
143
142
|
content: __props.message.content,
|
|
144
143
|
final: !isStreaming.value,
|
|
145
144
|
fade: false
|
|
146
|
-
}, __props.rendererProps), null, 16, [
|
|
147
|
-
"class",
|
|
148
|
-
"content",
|
|
149
|
-
"final"
|
|
150
|
-
])) : createCommentVNode("v-if", true),
|
|
145
|
+
}, __props.rendererProps), null, 16, ["content", "final"])) : createCommentVNode("v-if", true),
|
|
151
146
|
(openBlock(true), createElementBlock(Fragment, null, renderList(__props.message.toolCalls ?? [], (call) => {
|
|
152
147
|
return openBlock(), createBlock(_sfc_main$1, {
|
|
153
148
|
key: call.id,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"message-item.js","names":[],"sources":["../../../src/components/ai-chat/message-item.vue"],"sourcesContent":["<template>\n <div\n :class=\"[cls.e('message'), cls.em('message', message.role), bem.is('streaming', isStreaming)]\"\n >\n <!-- 用户消息:右对齐气泡 -->\n <template v-if=\"message.role === 'user'\">\n <div :class=\"cls.e('message-bubble')\">\n <div v-if=\"message.attachments?.length\" :class=\"cls.e('message-attachments')\">\n <img\n v-for=\"att in message.attachments\"\n :key=\"att.dataUrl\"\n :src=\"att.dataUrl\"\n :alt=\"att.name\"\n :class=\"cls.e('message-attachment')\"\n />\n </div>\n <div v-if=\"message.content\" :class=\"cls.e('message-text')\">{{ message.content }}</div>\n </div>\n </template>\n\n <!-- assistant 消息 -->\n <template v-else>\n <div\n v-if=\"message.reasoning\"\n :class=\"[cls.e('reasoning'), bem.is('expanded', reasoningExpanded)]\"\n >\n <div :class=\"cls.e('reasoning-header')\" @click=\"toggleReasoning\">\n <UIcon :class=\"[cls.e('reasoning-icon'), bem.is('loading', isThinking)]\">\n <Loading v-if=\"isThinking\" />\n <InfoCircle v-else />\n </UIcon>\n <span :class=\"[cls.e('reasoning-title'), isThinking && 'u-shine']\">\n {{ isThinking ? '思考中…' : '思考过程' }}\n </span>\n <UIcon :class=\"cls.e('reasoning-chevron')\"><ArrowRight /></UIcon>\n </div>\n <!-- 折叠时完全卸载内容 DOM:思考文本可能很长,常驻挂载浪费内存与渲染成本 -->\n <div v-if=\"reasoningExpanded\" :class=\"cls.e('reasoning-content')\">\n <UScroll\n ref=\"reasoningScrollRef\"\n container-style=\"max-height: 220px\"\n @scroll=\"handleReasoningScroll\"\n @wheel.passive=\"handleReasoningWheel\"\n >\n <div :class=\"cls.e('reasoning-text')\">{{ message.reasoning }}</div>\n </UScroll>\n </div>\n </div>\n\n <MarkdownRender\n v-if=\"message.content || isStreaming\"\n mode=\"chat\"\n :class=\"cls.e('message-content')\"\n :content=\"message.content\"\n :final=\"!isStreaming\"\n :fade=\"false\"\n v-bind=\"rendererProps\"\n />\n\n <ToolCallCard\n v-for=\"call in message.toolCalls ?? []\"\n :key=\"call.id\"\n :tool-call=\"call\"\n @respond=\"(approved) => emit('respond', call.id, approved)\"\n />\n\n <div v-if=\"message.status === 'error'\" :class=\"cls.e('message-status')\">生成出错</div>\n <div v-else-if=\"message.status === 'aborted'\" :class=\"cls.e('message-status')\">\n 已停止生成\n </div>\n\n <div v-if=\"showActions\" :class=\"cls.e('message-actions')\">\n <UButton\n size=\"small\"\n plain\n circle\n :type=\"copied ? 'success' : 'primary'\"\n :icon=\"copied ? CircleCheck : Copy\"\n :disabled=\"!canCopy\"\n :title=\"copied ? '已复制' : '复制'\"\n @click=\"handleCopy\"\n />\n <UButton\n size=\"small\"\n plain\n circle\n type=\"primary\"\n :icon=\"Refresh\"\n title=\"重新生成\"\n @click=\"emit('regenerate')\"\n />\n </div>\n </template>\n </div>\n</template>\n\n<script lang=\"ts\" setup>\nimport { message as toast, UButton, UIcon, UScroll } from '@veltra/desktop'\nimport type { ScrollPosition } from '@veltra/desktop'\nimport { ArrowRight, CircleCheck, Copy, InfoCircle, Loading, Refresh } from '@veltra/icons/normal'\nimport { bem } from '@veltra/utils'\nimport MarkdownRender from 'markstream-vue'\nimport { computed, inject, nextTick, onBeforeUnmount, ref, useTemplateRef, watch } from 'vue'\n\nimport type { ChatMessage } from '../../chat/types'\nimport { AiChatDIKey } from './di'\nimport ToolCallCard from './tool-call.vue'\n\ndefineOptions({ name: 'UAiChatMessageItem' })\n\nconst props = defineProps<{\n message: ChatMessage\n /** 是否为最后一条可见消息(决定是否显示重新生成) */\n isLast: boolean\n /** 透传给 MarkdownRender 的属性 */\n rendererProps?: Record<string, unknown>\n}>()\n\nconst emit = defineEmits<{\n (e: 'respond', toolCallId: string, approved: boolean): void\n (e: 'regenerate'): void\n}>()\n\nconst di = inject(AiChatDIKey)\nconst cls = di?.cls ?? bem('ai-chat')\n\nconst isStreaming = computed(() => props.message.status === 'streaming')\n/** 思考中:流式且正文还未开始输出 */\nconst isThinking = computed(() => isStreaming.value && !props.message.content)\n\nconst reasoningExpanded = ref(true)\n\n/** 思考区吸附底部:用户在思考区内上滚时取消吸附,回到底部后恢复 */\nconst reasoningStick = ref(true)\n\n/** 思考内容滚动区:流式输出时吸附底部,始终展示最新思考 */\nconst reasoningScrollRef = useTemplateRef<InstanceType<typeof UScroll>>('reasoningScrollRef')\n\nconst toggleReasoning = async () => {\n reasoningExpanded.value = !reasoningExpanded.value\n if (!reasoningExpanded.value) return\n // 重新展开时恢复吸附并定位到最新思考\n reasoningStick.value = true\n await nextTick()\n reasoningScrollRef.value?.scrollTo({ y: Number.MAX_SAFE_INTEGER })\n}\n\nconst handleReasoningWheel = (e: WheelEvent) => {\n if (e.deltaY < 0) reasoningStick.value = false\n}\n\nconst handleReasoningScroll = (position: Required<ScrollPosition>) => {\n if (position.sh - position.ch - position.y < 8) reasoningStick.value = true\n}\n\n// 流式结束后自动折叠思考过程;immediate 保证终态消息重挂载(过程块展开/收起、载入历史会话)时呈折叠态\nwatch(\n () => props.message.status,\n (status) => {\n if (status === 'streaming') {\n reasoningExpanded.value = true\n reasoningStick.value = true\n } else if (status) {\n reasoningExpanded.value = false\n }\n },\n { immediate: true }\n)\n\nwatch(\n () => props.message.reasoning,\n async () => {\n if (!isThinking.value || !reasoningExpanded.value || !reasoningStick.value) return\n await nextTick()\n // 等待 DOM 更新期间用户可能已上滚,滚动前重新确认吸附状态\n if (!reasoningStick.value) return\n reasoningScrollRef.value?.scrollTo({ y: Number.MAX_SAFE_INTEGER })\n }\n)\n\nconst showActions = computed(() => {\n if (props.message.role !== 'assistant' || !props.isLast) return false\n return ['done', 'error', 'aborted'].includes(props.message.status ?? '')\n})\n\nconst canCopy = computed(() => !!props.message.content?.trim())\n\nconst copied = ref(false)\nlet copyTimer: ReturnType<typeof setTimeout> | undefined\n\nconst handleCopy = async () => {\n const text = props.message.content?.trim()\n if (!text) return\n try {\n await navigator.clipboard.writeText(text)\n copied.value = true\n toast.success('已复制到剪贴板')\n clearTimeout(copyTimer)\n copyTimer = setTimeout(() => {\n copied.value = false\n }, 2000)\n } catch {\n toast.error('复制失败,请检查浏览器权限')\n }\n}\n\nonBeforeUnmount(() => clearTimeout(copyTimer))\n</script>\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"message-item.js","names":[],"sources":["../../../src/components/ai-chat/message-item.vue"],"sourcesContent":["<template>\n <div\n :class=\"[cls.e('message'), cls.em('message', message.role), bem.is('streaming', isStreaming)]\"\n >\n <!-- 用户消息:右对齐气泡 -->\n <template v-if=\"message.role === 'user'\">\n <div :class=\"cls.e('message-bubble')\">\n <div v-if=\"message.attachments?.length\" :class=\"cls.e('message-attachments')\">\n <img\n v-for=\"att in message.attachments\"\n :key=\"att.dataUrl\"\n :src=\"att.dataUrl\"\n :alt=\"att.name\"\n :class=\"cls.e('message-attachment')\"\n />\n </div>\n <div v-if=\"message.content\" :class=\"cls.e('message-text')\">{{ message.content }}</div>\n </div>\n </template>\n\n <!-- assistant 消息 -->\n <template v-else>\n <div\n v-if=\"message.reasoning\"\n :class=\"[cls.e('reasoning'), bem.is('expanded', reasoningExpanded)]\"\n >\n <div :class=\"cls.e('reasoning-header')\" @click=\"toggleReasoning\">\n <UIcon :class=\"[cls.e('reasoning-icon'), bem.is('loading', isThinking)]\">\n <Loading v-if=\"isThinking\" />\n <InfoCircle v-else />\n </UIcon>\n <span :class=\"[cls.e('reasoning-title'), isThinking && 'u-shine']\">\n {{ isThinking ? '思考中…' : '思考过程' }}\n </span>\n <UIcon :class=\"cls.e('reasoning-chevron')\"><ArrowRight /></UIcon>\n </div>\n <!-- 折叠时完全卸载内容 DOM:思考文本可能很长,常驻挂载浪费内存与渲染成本 -->\n <div v-if=\"reasoningExpanded\" :class=\"cls.e('reasoning-content')\">\n <UScroll\n ref=\"reasoningScrollRef\"\n container-style=\"max-height: 220px\"\n @scroll=\"handleReasoningScroll\"\n @wheel.passive=\"handleReasoningWheel\"\n >\n <div :class=\"cls.e('reasoning-text')\">{{ message.reasoning }}</div>\n </UScroll>\n </div>\n </div>\n\n <MarkdownRender\n v-if=\"message.content || isStreaming\"\n mode=\"chat\"\n :content=\"message.content\"\n :final=\"!isStreaming\"\n :fade=\"false\"\n v-bind=\"rendererProps\"\n />\n\n <ToolCallCard\n v-for=\"call in message.toolCalls ?? []\"\n :key=\"call.id\"\n :tool-call=\"call\"\n @respond=\"(approved) => emit('respond', call.id, approved)\"\n />\n\n <div v-if=\"message.status === 'error'\" :class=\"cls.e('message-status')\">生成出错</div>\n <div v-else-if=\"message.status === 'aborted'\" :class=\"cls.e('message-status')\">\n 已停止生成\n </div>\n\n <div v-if=\"showActions\" :class=\"cls.e('message-actions')\">\n <UButton\n size=\"small\"\n plain\n circle\n :type=\"copied ? 'success' : 'primary'\"\n :icon=\"copied ? CircleCheck : Copy\"\n :disabled=\"!canCopy\"\n :title=\"copied ? '已复制' : '复制'\"\n @click=\"handleCopy\"\n />\n <UButton\n size=\"small\"\n plain\n circle\n type=\"primary\"\n :icon=\"Refresh\"\n title=\"重新生成\"\n @click=\"emit('regenerate')\"\n />\n </div>\n </template>\n </div>\n</template>\n\n<script lang=\"ts\" setup>\nimport { message as toast, UButton, UIcon, UScroll } from '@veltra/desktop'\nimport type { ScrollPosition } from '@veltra/desktop'\nimport { ArrowRight, CircleCheck, Copy, InfoCircle, Loading, Refresh } from '@veltra/icons/normal'\nimport { bem } from '@veltra/utils'\nimport MarkdownRender from 'markstream-vue'\nimport { computed, inject, nextTick, onBeforeUnmount, ref, useTemplateRef, watch } from 'vue'\n\nimport type { ChatMessage } from '../../chat/types'\nimport { AiChatDIKey } from './di'\nimport ToolCallCard from './tool-call.vue'\n\ndefineOptions({ name: 'UAiChatMessageItem' })\n\nconst props = defineProps<{\n message: ChatMessage\n /** 是否为最后一条可见消息(决定是否显示重新生成) */\n isLast: boolean\n /** 透传给 MarkdownRender 的属性 */\n rendererProps?: Record<string, unknown>\n}>()\n\nconst emit = defineEmits<{\n (e: 'respond', toolCallId: string, approved: boolean): void\n (e: 'regenerate'): void\n}>()\n\nconst di = inject(AiChatDIKey)\nconst cls = di?.cls ?? bem('ai-chat')\n\nconst isStreaming = computed(() => props.message.status === 'streaming')\n/** 思考中:流式且正文还未开始输出 */\nconst isThinking = computed(() => isStreaming.value && !props.message.content)\n\nconst reasoningExpanded = ref(true)\n\n/** 思考区吸附底部:用户在思考区内上滚时取消吸附,回到底部后恢复 */\nconst reasoningStick = ref(true)\n\n/** 思考内容滚动区:流式输出时吸附底部,始终展示最新思考 */\nconst reasoningScrollRef = useTemplateRef<InstanceType<typeof UScroll>>('reasoningScrollRef')\n\nconst toggleReasoning = async () => {\n reasoningExpanded.value = !reasoningExpanded.value\n if (!reasoningExpanded.value) return\n // 重新展开时恢复吸附并定位到最新思考\n reasoningStick.value = true\n await nextTick()\n reasoningScrollRef.value?.scrollTo({ y: Number.MAX_SAFE_INTEGER })\n}\n\nconst handleReasoningWheel = (e: WheelEvent) => {\n if (e.deltaY < 0) reasoningStick.value = false\n}\n\nconst handleReasoningScroll = (position: Required<ScrollPosition>) => {\n if (position.sh - position.ch - position.y < 8) reasoningStick.value = true\n}\n\n// 流式结束后自动折叠思考过程;immediate 保证终态消息重挂载(过程块展开/收起、载入历史会话)时呈折叠态\nwatch(\n () => props.message.status,\n (status) => {\n if (status === 'streaming') {\n reasoningExpanded.value = true\n reasoningStick.value = true\n } else if (status) {\n reasoningExpanded.value = false\n }\n },\n { immediate: true }\n)\n\nwatch(\n () => props.message.reasoning,\n async () => {\n if (!isThinking.value || !reasoningExpanded.value || !reasoningStick.value) return\n await nextTick()\n // 等待 DOM 更新期间用户可能已上滚,滚动前重新确认吸附状态\n if (!reasoningStick.value) return\n reasoningScrollRef.value?.scrollTo({ y: Number.MAX_SAFE_INTEGER })\n }\n)\n\nconst showActions = computed(() => {\n if (props.message.role !== 'assistant' || !props.isLast) return false\n return ['done', 'error', 'aborted'].includes(props.message.status ?? '')\n})\n\nconst canCopy = computed(() => !!props.message.content?.trim())\n\nconst copied = ref(false)\nlet copyTimer: ReturnType<typeof setTimeout> | undefined\n\nconst handleCopy = async () => {\n const text = props.message.content?.trim()\n if (!text) return\n try {\n await navigator.clipboard.writeText(text)\n copied.value = true\n toast.success('已复制到剪贴板')\n clearTimeout(copyTimer)\n copyTimer = setTimeout(() => {\n copied.value = false\n }, 2000)\n } catch {\n toast.error('复制失败,请检查浏览器权限')\n }\n}\n\nonBeforeUnmount(() => clearTimeout(copyTimer))\n</script>\n"],"mappings":"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"}
|
|
@@ -156,6 +156,13 @@ const _sfc_main = /*@__PURE__*/ defineComponent({
|
|
|
156
156
|
return;
|
|
157
157
|
}
|
|
158
158
|
if (!prev) return;
|
|
159
|
+
if (visibleMessages.value.length === 0) {
|
|
160
|
+
finishing.value = false;
|
|
161
|
+
workingLeaving.value = false;
|
|
162
|
+
idleLeaving.value = false;
|
|
163
|
+
idleEnter.value = false;
|
|
164
|
+
return;
|
|
165
|
+
}
|
|
159
166
|
finishing.value = true;
|
|
160
167
|
idleLeaving.value = false;
|
|
161
168
|
const last = visibleMessages.value[visibleMessages.value.length - 1];
|
|
@@ -175,6 +182,14 @@ const _sfc_main = /*@__PURE__*/ defineComponent({
|
|
|
175
182
|
}, JUMP_MS);
|
|
176
183
|
}, WORKING_LINGER_MS);
|
|
177
184
|
});
|
|
185
|
+
watch(() => visibleMessages.value.length, (len) => {
|
|
186
|
+
if (len > 0) return;
|
|
187
|
+
clearJumpTimers();
|
|
188
|
+
finishing.value = false;
|
|
189
|
+
workingLeaving.value = false;
|
|
190
|
+
idleLeaving.value = false;
|
|
191
|
+
idleEnter.value = false;
|
|
192
|
+
});
|
|
178
193
|
watch(() => [welcomeItems.value.length, showIdleWelcome.value], () => {
|
|
179
194
|
if (showIdleWelcome.value) startWelcomeRotation();
|
|
180
195
|
else stopWelcomeRotation();
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"message-list.js","names":[],"sources":["../../../src/components/ai-chat/message-list.vue"],"sourcesContent":["<template>\n <div :class=\"cls.e('list-wrap')\">\n <UScroll\n :class=\"cls.e('list')\"\n ref=\"scrollRef\"\n always\n @scroll=\"handleScroll\"\n @wheel.passive=\"handleWheel\"\n >\n <template v-for=\"turn in turns\" :key=\"turn.key\">\n <MessageItem\n v-if=\"turn.userMsg\"\n :message=\"turn.userMsg\"\n :is-last=\"false\"\n :renderer-props=\"rendererProps\"\n @respond=\"(id, approved) => emit('respond', id, approved)\"\n @regenerate=\"emit('regenerate')\"\n />\n\n <!-- 最终答案开始输出后,本轮之前的思考/工具调用过程收进「已完成」折叠块 -->\n <TurnProcess\n v-if=\"turn.processCollapsed\"\n :messages=\"turn.processMsgs\"\n :renderer-props=\"rendererProps\"\n @respond=\"(id, approved) => emit('respond', id, approved)\"\n />\n <template v-else>\n <MessageItem\n v-for=\"msg in turn.processMsgs\"\n :key=\"msg.id\"\n :message=\"msg\"\n :is-last=\"false\"\n :renderer-props=\"rendererProps\"\n @respond=\"(id, approved) => emit('respond', id, approved)\"\n @regenerate=\"emit('regenerate')\"\n />\n </template>\n\n <MessageItem\n v-if=\"turn.answerMsg\"\n :message=\"turn.answerMsg\"\n :is-last=\"turn.isLast\"\n :renderer-props=\"rendererProps\"\n @respond=\"(id, approved) => emit('respond', id, approved)\"\n @regenerate=\"emit('regenerate')\"\n />\n </template>\n\n <!-- 工作中:活体球从输入框上方跳到最新会话下面;结束停留后再跳回 -->\n <div v-if=\"showWorking\" :class=\"[cls.e('working'), bem.is('leaving', workingLeaving)]\">\n <UAiOrb ref=\"workingOrb\" :size=\"ORB_SIZE\" :status=\"workingOrbStatus\" />\n <span v-if=\"running\" :class=\"[cls.e('working-text'), 'u-shine']\">工作中…</span>\n </div>\n </UScroll>\n\n <!-- 空闲:始终钉在滚动容器外、输入框上方;工作开始时缩小离开、结束后放大回来 -->\n <div\n v-if=\"showIdleWelcome\"\n :class=\"[cls.e('welcome'), bem.is('leaving', idleLeaving), bem.is('enter', idleEnter)]\"\n >\n <slot name=\"welcome\">\n <div :class=\"cls.e('welcome-inner')\">\n <UAiOrb :size=\"ORB_SIZE\" @click=\"cycleWelcome\" />\n <!-- 快捷提问逐条展示在球右侧并自动轮换:点文案发送,点球立即换下一条。\n 固定锚点布局:球位置钉死不动,气泡只向右延展,避免轮换时水平瞬移 -->\n <div v-if=\"welcomeItems.length\" :class=\"cls.e('welcome-item-wrap')\">\n <Transition :name=\"cls.em('welcome', 'swap')\" mode=\"out-in\">\n <button\n v-if=\"currentWelcomeItem\"\n :key=\"welcomeIndex\"\n type=\"button\"\n :class=\"cls.e('welcome-item')\"\n @click=\"emit('welcome-click', currentWelcomeItem)\"\n >\n {{ currentWelcomeItem }}\n </button>\n </Transition>\n </div>\n </div>\n </slot>\n </div>\n\n <!-- 用户上翻浏览时悬浮入口:一键回到最新消息 -->\n <Transition :name=\"cls.em('to-latest', 'fade')\">\n <button v-if=\"showToLatest\" type=\"button\" :class=\"cls.e('to-latest')\" @click=\"scrollToLatest\">\n <UIcon><ArrowDown /></UIcon>\n <span>最新消息</span>\n </button>\n </Transition>\n </div>\n</template>\n\n<script lang=\"ts\" setup>\nimport { UIcon, UScroll } from '@veltra/desktop'\nimport type { ScrollPosition } from '@veltra/desktop'\nimport { ArrowDown } from '@veltra/icons/normal'\nimport { bem } from '@veltra/utils'\nimport {\n computed,\n inject,\n nextTick,\n onBeforeUnmount,\n ref,\n shallowRef,\n useTemplateRef,\n watch\n} from 'vue'\n\nimport type { ChatMessage } from '../../chat/types'\nimport type { AiOrbExposed, AiOrbReaction, AiOrbStatus } from '../../types/ai-orb'\nimport UAiOrb from '../ai-orb/ai-orb.vue'\nimport { AiChatDIKey } from './di'\nimport MessageItem from './message-item.vue'\nimport TurnProcess from './turn-process.vue'\n\ndefineOptions({ name: 'UAiChatMessageList' })\n\n/** 空闲欢迎 / 工作指示共用活体球直径(px) */\nconst ORB_SIZE = 48\n/** 生成结束 / 失败后工作球停留再跳回输入框上方 */\nconst WORKING_LINGER_MS = 2500\n/** 两处活体球对向缩放的时长(与样式中的 jump 过渡一致) */\nconst JUMP_MS = 380\n\nconst props = defineProps<{\n messages: ChatMessage[]\n /** 空闲时输入框上方的快捷提问;字符串按单项处理 */\n welcome?: string | string[]\n /** 是否生成中(控制底部工作状态指示) */\n running?: boolean\n /** 透传给 MarkdownRender 的属性 */\n rendererProps?: Record<string, unknown>\n}>()\n\nconst emit = defineEmits<{\n (e: 'respond', toolCallId: string, approved: boolean): void\n (e: 'regenerate'): void\n /** 点击欢迎项(快捷提问) */\n (e: 'welcome-click', text: string): void\n}>()\n\ndefineSlots<{\n /** 空闲欢迎区插槽(输入框上方;工作中跳到列表末尾) */\n welcome(): any\n}>()\n\nconst di = inject(AiChatDIKey)\nconst cls = di?.cls ?? bem('ai-chat')\n\n/** tool 消息不单独渲染,其内容体现在工具卡片的结果区 */\nconst visibleMessages = computed(() => props.messages.filter((msg) => msg.role !== 'tool'))\n\n/** 一轮对话:以 user 消息为界,含本轮全部 assistant 消息(每次工具循环产生一条) */\ninterface ChatTurn {\n /** 轮次 key(取用户消息或首条 assistant 消息 id) */\n key: string\n userMsg?: ChatMessage\n /** 最终答案之前的过程消息(思考 + 中间文本 + 工具卡片) */\n processMsgs: ChatMessage[]\n /** 本轮最终答案(最后一条 assistant 消息) */\n answerMsg?: ChatMessage\n /** 过程消息是否收进「已完成」折叠块 */\n processCollapsed: boolean\n /** answerMsg 是否为全局最后一条可见消息 */\n isLast: boolean\n}\n\nconst isFinalStatus = (msg?: ChatMessage) =>\n msg?.status === 'done' || msg?.status === 'error' || msg?.status === 'aborted'\n\nconst turns = computed<ChatTurn[]>(() => {\n const grouped: { key: string; userMsg?: ChatMessage; assistants: ChatMessage[] }[] = []\n for (const msg of visibleMessages.value) {\n if (msg.role === 'user') {\n grouped.push({ key: msg.id, userMsg: msg, assistants: [] })\n continue\n }\n const last = grouped[grouped.length - 1]\n // 兼容 assistant 开头的历史会话:归入无用户消息的轮次\n if (last) last.assistants.push(msg)\n else grouped.push({ key: msg.id, assistants: [msg] })\n }\n return grouped.map((turn, index) => {\n const processMsgs = turn.assistants.slice(0, -1)\n const answerMsg = turn.assistants[turn.assistants.length - 1]\n const isLastTurn = index === grouped.length - 1\n // 该轮结束(非最后一轮 / 答案进入终态)或最终答案开始输出时折叠过程。\n // content 只增不减,折叠后不会回弹;regenerate 删除本轮 assistant 重跑,条件自然复位\n const processCollapsed =\n processMsgs.length > 0 &&\n (!isLastTurn || !!answerMsg?.content || (!props.running && isFinalStatus(answerMsg)))\n return {\n key: turn.key,\n userMsg: turn.userMsg,\n processMsgs,\n answerMsg,\n processCollapsed,\n isLast: isLastTurn && !!answerMsg\n }\n })\n})\n\nconst welcomeItems = computed(() => {\n const welcome = props.welcome\n if (!welcome) return []\n return (Array.isArray(welcome) ? welcome : [welcome]).filter(Boolean)\n})\n\n/** 欢迎语逐条轮换:当前展示项的下标 */\nconst welcomeIndex = ref(0)\n\n/** 当前展示的欢迎语 */\nconst currentWelcomeItem = computed(() => {\n const items = welcomeItems.value\n return items.length ? items[welcomeIndex.value % items.length] : undefined\n})\n\nlet welcomeTimer: ReturnType<typeof setInterval> | undefined\n\nconst stopWelcomeRotation = () => {\n clearInterval(welcomeTimer)\n welcomeTimer = undefined\n}\n\nconst startWelcomeRotation = () => {\n stopWelcomeRotation()\n if (welcomeItems.value.length > 1) {\n welcomeTimer = setInterval(() => {\n welcomeIndex.value += 1\n }, 4000)\n }\n}\n\n/** 点击欢迎球:不等自动轮换,立即换下一条,并重置计时 */\nconst cycleWelcome = () => {\n if (welcomeItems.value.length <= 1) return\n welcomeIndex.value += 1\n startWelcomeRotation()\n}\n\n/** 回答完毕 / 失败后工作球短暂停留,播完表情再跳回输入框上方 */\nconst finishing = ref(false)\n/** 列表中的球正在缩小离开 */\nconst workingLeaving = ref(false)\n/** 输入框上方的球正在缩小离开 */\nconst idleLeaving = ref(false)\n/** 输入框上方的球从工作位放大回来(首屏出现不播) */\nconst idleEnter = ref(false)\n\nlet finishTimer: ReturnType<typeof setTimeout> | undefined\nlet jumpTimer: ReturnType<typeof setTimeout> | undefined\n\nconst clearJumpTimers = () => {\n clearTimeout(finishTimer)\n clearTimeout(jumpTimer)\n}\n\n/** 列表末尾的工作球:生成中 / 收尾停留 / 跳回过渡 */\nconst showWorking = computed(() => !!(props.running || finishing.value || workingLeaving.value))\n/** 输入框上方的空闲欢迎:含工作开始时的缩小离开帧 */\nconst showIdleWelcome = computed(() => (!props.running && !finishing.value) || idleLeaving.value)\n\nconst workingOrbRef = useTemplateRef<AiOrbExposed>('workingOrb')\n\n/** 工具调用失败的 id 去重集合:同一次失败只播一次沮丧表情 */\nconst reactedToolErrorIds = new Set<string>()\n\nconst toolErrorIds = computed(() => {\n const ids: string[] = []\n for (const msg of props.messages) {\n if (msg.role !== 'assistant' || !msg.toolCalls) continue\n for (const call of msg.toolCalls) {\n if (call.status === 'error') ids.push(call.id)\n }\n }\n return ids\n})\n\n// 工具调用失败 → 工作球闭眼摇头(frustrated)\nwatch(toolErrorIds, (ids) => {\n for (const id of ids) {\n if (reactedToolErrorIds.has(id)) continue\n reactedToolErrorIds.add(id)\n workingOrbRef.value?.react('frustrated')\n }\n})\n\n/** 工作球状态:收尾停留 → idle;正文输出中 → speaking;其余生成阶段 → thinking */\nconst workingOrbStatus = computed<AiOrbStatus>(() => {\n if (finishing.value) return 'idle'\n const last = visibleMessages.value[visibleMessages.value.length - 1]\n if (last?.role === 'assistant' && last.status === 'streaming' && last.content) {\n return 'speaking'\n }\n return 'thinking'\n})\n\nwatch(\n () => props.running,\n (running, prev) => {\n if (running) {\n // 工作开始:立即从输入框上方跳到列表,无停留\n clearJumpTimers()\n const idleWasVisible = !prev && !finishing.value && !workingLeaving.value\n finishing.value = false\n workingLeaving.value = false\n idleEnter.value = false\n if (idleWasVisible) {\n idleLeaving.value = true\n jumpTimer = setTimeout(() => {\n idleLeaving.value = false\n }, JUMP_MS)\n } else {\n idleLeaving.value = false\n }\n return\n }\n if (!prev) return\n\n finishing.value = true\n idleLeaving.value = false\n const last = visibleMessages.value[visibleMessages.value.length - 1]\n let reaction: AiOrbReaction | undefined\n if (last?.role === 'assistant') {\n if (last.status === 'done') reaction = 'happy'\n else if (last.status === 'error') reaction = 'frustrated'\n }\n if (reaction) {\n nextTick(() => workingOrbRef.value?.react(reaction))\n }\n // 停留结束 → 列表中缩小、输入框上方放大\n finishTimer = setTimeout(() => {\n finishing.value = false\n workingLeaving.value = true\n idleEnter.value = true\n jumpTimer = setTimeout(() => {\n workingLeaving.value = false\n idleEnter.value = false\n }, JUMP_MS)\n }, WORKING_LINGER_MS)\n }\n)\n\n// 空闲欢迎区展示期间自动轮换;跳到工作位后停止\nwatch(\n () => [welcomeItems.value.length, showIdleWelcome.value] as const,\n () => {\n if (showIdleWelcome.value) startWelcomeRotation()\n else stopWelcomeRotation()\n },\n { immediate: true }\n)\n\nonBeforeUnmount(() => {\n stopWelcomeRotation()\n clearJumpTimers()\n})\n\nconst scrollRef = shallowRef<{ scrollTo: (position: ScrollPosition) => void }>()\n/** 是否吸附底部(用户上翻浏览历史时取消吸附) */\nconst stickToBottom = ref(true)\n/** 上一次滚动位置:用于区分用户上翻与自动吸底触发的 scroll 事件 */\nlet lastScrollY = 0\n\n/** 上翻阅读时展示「最新消息」悬浮按钮 */\nconst showToLatest = computed(() => !stickToBottom.value && visibleMessages.value.length > 0)\n\nconst handleScroll = (position: Required<ScrollPosition>) => {\n const atBottom = position.sh - position.ch - position.y < 60\n if (atBottom) {\n stickToBottom.value = true\n } else if (position.y < lastScrollY) {\n // 只有「向上滚」才算用户离开底部的意图:自动吸底的 scroll 事件可能滞后于\n // 流式内容增长(sh 已变大、y 仍是旧底部),按位置判断会误判成未吸底\n stickToBottom.value = false\n }\n lastScrollY = position.y\n}\n\n/**\n * 用户向上滚动轮 = 明确的离开底部意图,立即取消吸附。\n * 不能等 scroll 事件再按方向判断:流式期间每个 chunk 都会排一次吸底滚动,\n * 滞后的 scrollTo 会把用户拉回底部并触发 atBottom 重新吸附,导致「上滚动不了」\n */\nconst handleWheel = (e: WheelEvent) => {\n if (e.deltaY < 0) stickToBottom.value = false\n}\n\n/** 点击悬浮按钮:恢复吸附并回到底部 */\nconst scrollToLatest = async () => {\n stickToBottom.value = true\n await nextTick()\n scrollRef.value?.scrollTo({ y: Number.MAX_SAFE_INTEGER })\n}\n\n// 消息数量或流式内容变化时,若处于吸附状态则滚动到底部\nwatch(\n () => {\n const list = visibleMessages.value\n const last = list[list.length - 1]\n return [\n list.length,\n last?.content.length ?? 0,\n last?.reasoning?.length ?? 0,\n last?.toolCalls?.length ?? 0,\n props.running\n ].join('|')\n },\n async () => {\n // 用户刚发出消息时强制回到底部(无论之前是否在上翻)\n const list = visibleMessages.value\n if (list[list.length - 1]?.role === 'user') stickToBottom.value = true\n if (!stickToBottom.value) return\n await nextTick()\n // 等待 DOM 更新期间用户可能已上滚,滚动前重新确认吸附状态,避免把用户拉回底部\n if (!stickToBottom.value) return\n scrollRef.value?.scrollTo({ y: Number.MAX_SAFE_INTEGER })\n }\n)\n\nlet trailingScrollTimer: ReturnType<typeof setTimeout> | undefined\n\n// 生成收尾时动作区出现 / markdown 终态渲染 / 思考块折叠会再次改变高度,\n// 同帧滚动可能够不到最终底部,追加一次延迟兜底滚动\nwatch(\n () => props.running,\n async (running) => {\n if (running) return\n clearTimeout(trailingScrollTimer)\n if (!stickToBottom.value) return\n await nextTick()\n if (!stickToBottom.value) return\n scrollRef.value?.scrollTo({ y: Number.MAX_SAFE_INTEGER })\n trailingScrollTimer = setTimeout(() => {\n if (stickToBottom.value) scrollRef.value?.scrollTo({ y: Number.MAX_SAFE_INTEGER })\n }, 150)\n }\n)\n\nonBeforeUnmount(() => clearTimeout(trailingScrollTimer))\n</script>\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"message-list.js","names":[],"sources":["../../../src/components/ai-chat/message-list.vue"],"sourcesContent":["<template>\n <div :class=\"cls.e('list-wrap')\">\n <UScroll\n :class=\"cls.e('list')\"\n ref=\"scrollRef\"\n always\n @scroll=\"handleScroll\"\n @wheel.passive=\"handleWheel\"\n >\n <template v-for=\"turn in turns\" :key=\"turn.key\">\n <MessageItem\n v-if=\"turn.userMsg\"\n :message=\"turn.userMsg\"\n :is-last=\"false\"\n :renderer-props=\"rendererProps\"\n @respond=\"(id, approved) => emit('respond', id, approved)\"\n @regenerate=\"emit('regenerate')\"\n />\n\n <!-- 最终答案开始输出后,本轮之前的思考/工具调用过程收进「已完成」折叠块 -->\n <TurnProcess\n v-if=\"turn.processCollapsed\"\n :messages=\"turn.processMsgs\"\n :renderer-props=\"rendererProps\"\n @respond=\"(id, approved) => emit('respond', id, approved)\"\n />\n <template v-else>\n <MessageItem\n v-for=\"msg in turn.processMsgs\"\n :key=\"msg.id\"\n :message=\"msg\"\n :is-last=\"false\"\n :renderer-props=\"rendererProps\"\n @respond=\"(id, approved) => emit('respond', id, approved)\"\n @regenerate=\"emit('regenerate')\"\n />\n </template>\n\n <MessageItem\n v-if=\"turn.answerMsg\"\n :message=\"turn.answerMsg\"\n :is-last=\"turn.isLast\"\n :renderer-props=\"rendererProps\"\n @respond=\"(id, approved) => emit('respond', id, approved)\"\n @regenerate=\"emit('regenerate')\"\n />\n </template>\n\n <!-- 工作中:活体球从输入框上方跳到最新会话下面;结束停留后再跳回 -->\n <div v-if=\"showWorking\" :class=\"[cls.e('working'), bem.is('leaving', workingLeaving)]\">\n <UAiOrb ref=\"workingOrb\" :size=\"ORB_SIZE\" :status=\"workingOrbStatus\" />\n <span v-if=\"running\" :class=\"[cls.e('working-text'), 'u-shine']\">工作中…</span>\n </div>\n </UScroll>\n\n <!-- 空闲:始终钉在滚动容器外、输入框上方;工作开始时缩小离开、结束后放大回来 -->\n <div\n v-if=\"showIdleWelcome\"\n :class=\"[cls.e('welcome'), bem.is('leaving', idleLeaving), bem.is('enter', idleEnter)]\"\n >\n <slot name=\"welcome\">\n <div :class=\"cls.e('welcome-inner')\">\n <UAiOrb :size=\"ORB_SIZE\" @click=\"cycleWelcome\" />\n <!-- 快捷提问逐条展示在球右侧并自动轮换:点文案发送,点球立即换下一条。\n 固定锚点布局:球位置钉死不动,气泡只向右延展,避免轮换时水平瞬移 -->\n <div v-if=\"welcomeItems.length\" :class=\"cls.e('welcome-item-wrap')\">\n <Transition :name=\"cls.em('welcome', 'swap')\" mode=\"out-in\">\n <button\n v-if=\"currentWelcomeItem\"\n :key=\"welcomeIndex\"\n type=\"button\"\n :class=\"cls.e('welcome-item')\"\n @click=\"emit('welcome-click', currentWelcomeItem)\"\n >\n {{ currentWelcomeItem }}\n </button>\n </Transition>\n </div>\n </div>\n </slot>\n </div>\n\n <!-- 用户上翻浏览时悬浮入口:一键回到最新消息 -->\n <Transition :name=\"cls.em('to-latest', 'fade')\">\n <button v-if=\"showToLatest\" type=\"button\" :class=\"cls.e('to-latest')\" @click=\"scrollToLatest\">\n <UIcon><ArrowDown /></UIcon>\n <span>最新消息</span>\n </button>\n </Transition>\n </div>\n</template>\n\n<script lang=\"ts\" setup>\nimport { UIcon, UScroll } from '@veltra/desktop'\nimport type { ScrollPosition } from '@veltra/desktop'\nimport { ArrowDown } from '@veltra/icons/normal'\nimport { bem } from '@veltra/utils'\nimport {\n computed,\n inject,\n nextTick,\n onBeforeUnmount,\n ref,\n shallowRef,\n useTemplateRef,\n watch\n} from 'vue'\n\nimport type { ChatMessage } from '../../chat/types'\nimport type { AiOrbExposed, AiOrbReaction, AiOrbStatus } from '../../types/ai-orb'\nimport UAiOrb from '../ai-orb/ai-orb.vue'\nimport { AiChatDIKey } from './di'\nimport MessageItem from './message-item.vue'\nimport TurnProcess from './turn-process.vue'\n\ndefineOptions({ name: 'UAiChatMessageList' })\n\n/** 空闲欢迎 / 工作指示共用活体球直径(px) */\nconst ORB_SIZE = 48\n/** 生成结束 / 失败后工作球停留再跳回输入框上方 */\nconst WORKING_LINGER_MS = 2500\n/** 两处活体球对向缩放的时长(与样式中的 jump 过渡一致) */\nconst JUMP_MS = 380\n\nconst props = defineProps<{\n messages: ChatMessage[]\n /** 空闲时输入框上方的快捷提问;字符串按单项处理 */\n welcome?: string | string[]\n /** 是否生成中(控制底部工作状态指示) */\n running?: boolean\n /** 透传给 MarkdownRender 的属性 */\n rendererProps?: Record<string, unknown>\n}>()\n\nconst emit = defineEmits<{\n (e: 'respond', toolCallId: string, approved: boolean): void\n (e: 'regenerate'): void\n /** 点击欢迎项(快捷提问) */\n (e: 'welcome-click', text: string): void\n}>()\n\ndefineSlots<{\n /** 空闲欢迎区插槽(输入框上方;工作中跳到列表末尾) */\n welcome(): any\n}>()\n\nconst di = inject(AiChatDIKey)\nconst cls = di?.cls ?? bem('ai-chat')\n\n/** tool 消息不单独渲染,其内容体现在工具卡片的结果区 */\nconst visibleMessages = computed(() => props.messages.filter((msg) => msg.role !== 'tool'))\n\n/** 一轮对话:以 user 消息为界,含本轮全部 assistant 消息(每次工具循环产生一条) */\ninterface ChatTurn {\n /** 轮次 key(取用户消息或首条 assistant 消息 id) */\n key: string\n userMsg?: ChatMessage\n /** 最终答案之前的过程消息(思考 + 中间文本 + 工具卡片) */\n processMsgs: ChatMessage[]\n /** 本轮最终答案(最后一条 assistant 消息) */\n answerMsg?: ChatMessage\n /** 过程消息是否收进「已完成」折叠块 */\n processCollapsed: boolean\n /** answerMsg 是否为全局最后一条可见消息 */\n isLast: boolean\n}\n\nconst isFinalStatus = (msg?: ChatMessage) =>\n msg?.status === 'done' || msg?.status === 'error' || msg?.status === 'aborted'\n\nconst turns = computed<ChatTurn[]>(() => {\n const grouped: { key: string; userMsg?: ChatMessage; assistants: ChatMessage[] }[] = []\n for (const msg of visibleMessages.value) {\n if (msg.role === 'user') {\n grouped.push({ key: msg.id, userMsg: msg, assistants: [] })\n continue\n }\n const last = grouped[grouped.length - 1]\n // 兼容 assistant 开头的历史会话:归入无用户消息的轮次\n if (last) last.assistants.push(msg)\n else grouped.push({ key: msg.id, assistants: [msg] })\n }\n return grouped.map((turn, index) => {\n const processMsgs = turn.assistants.slice(0, -1)\n const answerMsg = turn.assistants[turn.assistants.length - 1]\n const isLastTurn = index === grouped.length - 1\n // 该轮结束(非最后一轮 / 答案进入终态)或最终答案开始输出时折叠过程。\n // content 只增不减,折叠后不会回弹;regenerate 删除本轮 assistant 重跑,条件自然复位\n const processCollapsed =\n processMsgs.length > 0 &&\n (!isLastTurn || !!answerMsg?.content || (!props.running && isFinalStatus(answerMsg)))\n return {\n key: turn.key,\n userMsg: turn.userMsg,\n processMsgs,\n answerMsg,\n processCollapsed,\n isLast: isLastTurn && !!answerMsg\n }\n })\n})\n\nconst welcomeItems = computed(() => {\n const welcome = props.welcome\n if (!welcome) return []\n return (Array.isArray(welcome) ? welcome : [welcome]).filter(Boolean)\n})\n\n/** 欢迎语逐条轮换:当前展示项的下标 */\nconst welcomeIndex = ref(0)\n\n/** 当前展示的欢迎语 */\nconst currentWelcomeItem = computed(() => {\n const items = welcomeItems.value\n return items.length ? items[welcomeIndex.value % items.length] : undefined\n})\n\nlet welcomeTimer: ReturnType<typeof setInterval> | undefined\n\nconst stopWelcomeRotation = () => {\n clearInterval(welcomeTimer)\n welcomeTimer = undefined\n}\n\nconst startWelcomeRotation = () => {\n stopWelcomeRotation()\n if (welcomeItems.value.length > 1) {\n welcomeTimer = setInterval(() => {\n welcomeIndex.value += 1\n }, 4000)\n }\n}\n\n/** 点击欢迎球:不等自动轮换,立即换下一条,并重置计时 */\nconst cycleWelcome = () => {\n if (welcomeItems.value.length <= 1) return\n welcomeIndex.value += 1\n startWelcomeRotation()\n}\n\n/** 回答完毕 / 失败后工作球短暂停留,播完表情再跳回输入框上方 */\nconst finishing = ref(false)\n/** 列表中的球正在缩小离开 */\nconst workingLeaving = ref(false)\n/** 输入框上方的球正在缩小离开 */\nconst idleLeaving = ref(false)\n/** 输入框上方的球从工作位放大回来(首屏出现不播) */\nconst idleEnter = ref(false)\n\nlet finishTimer: ReturnType<typeof setTimeout> | undefined\nlet jumpTimer: ReturnType<typeof setTimeout> | undefined\n\nconst clearJumpTimers = () => {\n clearTimeout(finishTimer)\n clearTimeout(jumpTimer)\n}\n\n/** 列表末尾的工作球:生成中 / 收尾停留 / 跳回过渡 */\nconst showWorking = computed(() => !!(props.running || finishing.value || workingLeaving.value))\n/** 输入框上方的空闲欢迎:含工作开始时的缩小离开帧 */\nconst showIdleWelcome = computed(() => (!props.running && !finishing.value) || idleLeaving.value)\n\nconst workingOrbRef = useTemplateRef<AiOrbExposed>('workingOrb')\n\n/** 工具调用失败的 id 去重集合:同一次失败只播一次沮丧表情 */\nconst reactedToolErrorIds = new Set<string>()\n\nconst toolErrorIds = computed(() => {\n const ids: string[] = []\n for (const msg of props.messages) {\n if (msg.role !== 'assistant' || !msg.toolCalls) continue\n for (const call of msg.toolCalls) {\n if (call.status === 'error') ids.push(call.id)\n }\n }\n return ids\n})\n\n// 工具调用失败 → 工作球闭眼摇头(frustrated)\nwatch(toolErrorIds, (ids) => {\n for (const id of ids) {\n if (reactedToolErrorIds.has(id)) continue\n reactedToolErrorIds.add(id)\n workingOrbRef.value?.react('frustrated')\n }\n})\n\n/** 工作球状态:收尾停留 → idle;正文输出中 → speaking;其余生成阶段 → thinking */\nconst workingOrbStatus = computed<AiOrbStatus>(() => {\n if (finishing.value) return 'idle'\n const last = visibleMessages.value[visibleMessages.value.length - 1]\n if (last?.role === 'assistant' && last.status === 'streaming' && last.content) {\n return 'speaking'\n }\n return 'thinking'\n})\n\nwatch(\n () => props.running,\n (running, prev) => {\n if (running) {\n // 工作开始:立即从输入框上方跳到列表,无停留\n clearJumpTimers()\n const idleWasVisible = !prev && !finishing.value && !workingLeaving.value\n finishing.value = false\n workingLeaving.value = false\n idleEnter.value = false\n if (idleWasVisible) {\n idleLeaving.value = true\n jumpTimer = setTimeout(() => {\n idleLeaving.value = false\n }, JUMP_MS)\n } else {\n idleLeaving.value = false\n }\n return\n }\n if (!prev) return\n\n // 清除会话后列表已空:跳过结束停留,立刻回到欢迎区\n if (visibleMessages.value.length === 0) {\n finishing.value = false\n workingLeaving.value = false\n idleLeaving.value = false\n idleEnter.value = false\n return\n }\n\n finishing.value = true\n idleLeaving.value = false\n const last = visibleMessages.value[visibleMessages.value.length - 1]\n let reaction: AiOrbReaction | undefined\n if (last?.role === 'assistant') {\n if (last.status === 'done') reaction = 'happy'\n else if (last.status === 'error') reaction = 'frustrated'\n }\n if (reaction) {\n nextTick(() => workingOrbRef.value?.react(reaction))\n }\n // 停留结束 → 列表中缩小、输入框上方放大\n finishTimer = setTimeout(() => {\n finishing.value = false\n workingLeaving.value = true\n idleEnter.value = true\n jumpTimer = setTimeout(() => {\n workingLeaving.value = false\n idleEnter.value = false\n }, JUMP_MS)\n }, WORKING_LINGER_MS)\n }\n)\n\n// 消息被清空(clear):立刻收掉工作球,欢迎区恢复\nwatch(\n () => visibleMessages.value.length,\n (len) => {\n if (len > 0) return\n clearJumpTimers()\n finishing.value = false\n workingLeaving.value = false\n idleLeaving.value = false\n idleEnter.value = false\n }\n)\n\n// 空闲欢迎区展示期间自动轮换;跳到工作位后停止\nwatch(\n () => [welcomeItems.value.length, showIdleWelcome.value] as const,\n () => {\n if (showIdleWelcome.value) startWelcomeRotation()\n else stopWelcomeRotation()\n },\n { immediate: true }\n)\n\nonBeforeUnmount(() => {\n stopWelcomeRotation()\n clearJumpTimers()\n})\n\nconst scrollRef = shallowRef<{ scrollTo: (position: ScrollPosition) => void }>()\n/** 是否吸附底部(用户上翻浏览历史时取消吸附) */\nconst stickToBottom = ref(true)\n/** 上一次滚动位置:用于区分用户上翻与自动吸底触发的 scroll 事件 */\nlet lastScrollY = 0\n\n/** 上翻阅读时展示「最新消息」悬浮按钮 */\nconst showToLatest = computed(() => !stickToBottom.value && visibleMessages.value.length > 0)\n\nconst handleScroll = (position: Required<ScrollPosition>) => {\n const atBottom = position.sh - position.ch - position.y < 60\n if (atBottom) {\n stickToBottom.value = true\n } else if (position.y < lastScrollY) {\n // 只有「向上滚」才算用户离开底部的意图:自动吸底的 scroll 事件可能滞后于\n // 流式内容增长(sh 已变大、y 仍是旧底部),按位置判断会误判成未吸底\n stickToBottom.value = false\n }\n lastScrollY = position.y\n}\n\n/**\n * 用户向上滚动轮 = 明确的离开底部意图,立即取消吸附。\n * 不能等 scroll 事件再按方向判断:流式期间每个 chunk 都会排一次吸底滚动,\n * 滞后的 scrollTo 会把用户拉回底部并触发 atBottom 重新吸附,导致「上滚动不了」\n */\nconst handleWheel = (e: WheelEvent) => {\n if (e.deltaY < 0) stickToBottom.value = false\n}\n\n/** 点击悬浮按钮:恢复吸附并回到底部 */\nconst scrollToLatest = async () => {\n stickToBottom.value = true\n await nextTick()\n scrollRef.value?.scrollTo({ y: Number.MAX_SAFE_INTEGER })\n}\n\n// 消息数量或流式内容变化时,若处于吸附状态则滚动到底部\nwatch(\n () => {\n const list = visibleMessages.value\n const last = list[list.length - 1]\n return [\n list.length,\n last?.content.length ?? 0,\n last?.reasoning?.length ?? 0,\n last?.toolCalls?.length ?? 0,\n props.running\n ].join('|')\n },\n async () => {\n // 用户刚发出消息时强制回到底部(无论之前是否在上翻)\n const list = visibleMessages.value\n if (list[list.length - 1]?.role === 'user') stickToBottom.value = true\n if (!stickToBottom.value) return\n await nextTick()\n // 等待 DOM 更新期间用户可能已上滚,滚动前重新确认吸附状态,避免把用户拉回底部\n if (!stickToBottom.value) return\n scrollRef.value?.scrollTo({ y: Number.MAX_SAFE_INTEGER })\n }\n)\n\nlet trailingScrollTimer: ReturnType<typeof setTimeout> | undefined\n\n// 生成收尾时动作区出现 / markdown 终态渲染 / 思考块折叠会再次改变高度,\n// 同帧滚动可能够不到最终底部,追加一次延迟兜底滚动\nwatch(\n () => props.running,\n async (running) => {\n if (running) return\n clearTimeout(trailingScrollTimer)\n if (!stickToBottom.value) return\n await nextTick()\n if (!stickToBottom.value) return\n scrollRef.value?.scrollTo({ y: Number.MAX_SAFE_INTEGER })\n trailingScrollTimer = setTimeout(() => {\n if (stickToBottom.value) scrollRef.value?.scrollTo({ y: Number.MAX_SAFE_INTEGER })\n }, 150)\n }\n)\n\nonBeforeUnmount(() => clearTimeout(trailingScrollTimer))\n</script>\n"],"mappings":"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"}
|
|
@@ -5,6 +5,7 @@ import "@veltra/desktop/components/icon/style";
|
|
|
5
5
|
import "@veltra/desktop/components/input/style";
|
|
6
6
|
import "@veltra/desktop/components/layout/style";
|
|
7
7
|
import "@veltra/desktop/components/message/style";
|
|
8
|
+
import "@veltra/desktop/components/pop-confirm/style";
|
|
8
9
|
import "@veltra/desktop/components/scroll/style";
|
|
9
10
|
import "@veltra/desktop/components/select/style";
|
|
10
11
|
import "@veltra/styles/animations/shine.scss";
|
|
@@ -6,6 +6,7 @@ import "@veltra/desktop/components/icon/style";
|
|
|
6
6
|
import "@veltra/desktop/components/input/style";
|
|
7
7
|
import "@veltra/desktop/components/layout/style";
|
|
8
8
|
import "@veltra/desktop/components/message/style";
|
|
9
|
+
import "@veltra/desktop/components/pop-confirm/style";
|
|
9
10
|
import "@veltra/desktop/components/scroll/style";
|
|
10
11
|
import "@veltra/desktop/components/select/style";
|
|
11
12
|
import "@veltra/styles/animations/shine.scss";
|
|
@@ -359,9 +359,7 @@
|
|
|
359
359
|
border-radius: var(--u-radius-default);
|
|
360
360
|
display: block;
|
|
361
361
|
}
|
|
362
|
-
.u-ai-
|
|
363
|
-
font-size: 13px;
|
|
364
|
-
line-height: 1.6;
|
|
362
|
+
.u-ai-chat .markstream-vue {
|
|
365
363
|
--ms-text-body: 13px;
|
|
366
364
|
--ms-leading-body: 1.6;
|
|
367
365
|
--ms-text-h1: 1.55em;
|
|
@@ -387,6 +385,11 @@
|
|
|
387
385
|
--ms-flow-admonition-y: 0.7em;
|
|
388
386
|
--ms-flow-diagram-y: 0.7em;
|
|
389
387
|
}
|
|
388
|
+
.u-ai-chat .markstream-vue .list-disc {
|
|
389
|
+
margin-top: var(--ms-flow-list-y);
|
|
390
|
+
margin-bottom: var(--ms-flow-list-y);
|
|
391
|
+
padding-left: var(--ms-flow-list-indent);
|
|
392
|
+
}
|
|
390
393
|
.u-ai-chat__message-status {
|
|
391
394
|
margin-top: var(--u-gap-small);
|
|
392
395
|
color: var(--u-text-color-second);
|
|
@@ -473,16 +476,16 @@
|
|
|
473
476
|
margin: 4px 0;
|
|
474
477
|
font-size: var(--u-font-size-main-small);
|
|
475
478
|
}
|
|
476
|
-
.u-ai-chat__tool-call + .u-ai-chat__tool-call {
|
|
479
|
+
.u-ai-chat .u-ai-chat__tool-call + .u-ai-chat__tool-call {
|
|
477
480
|
margin-top: 4px;
|
|
478
481
|
}
|
|
479
|
-
.u-ai-chat__tool-call .u-collapse__header {
|
|
482
|
+
.u-ai-chat .u-ai-chat__tool-call .u-collapse__header {
|
|
480
483
|
gap: 6px;
|
|
481
484
|
padding: 5px var(--u-gap-small);
|
|
482
485
|
font-weight: 400;
|
|
483
486
|
letter-spacing: normal;
|
|
484
487
|
}
|
|
485
|
-
.u-ai-chat__tool-call .u-collapse__content {
|
|
488
|
+
.u-ai-chat .u-ai-chat__tool-call .u-collapse__content {
|
|
486
489
|
padding: var(--u-gap-small);
|
|
487
490
|
line-height: 1.5;
|
|
488
491
|
}
|
|
@@ -771,11 +774,8 @@
|
|
|
771
774
|
margin: 0 0 var(--u-gap-default);
|
|
772
775
|
border-radius: var(--u-radius-large);
|
|
773
776
|
background-color: var(--u-bg-color-top);
|
|
777
|
+
box-shadow: var(--u-shadow-sm);
|
|
774
778
|
padding: var(--u-gap-small);
|
|
775
|
-
transition: box-shadow 0.15s ease;
|
|
776
|
-
}
|
|
777
|
-
.u-ai-chat__input-area:focus-within {
|
|
778
|
-
box-shadow: 0 0 0 1px var(--u-color-primary);
|
|
779
779
|
}
|
|
780
780
|
.u-ai-chat__input {
|
|
781
781
|
width: 100%;
|
|
@@ -807,7 +807,8 @@
|
|
|
807
807
|
align-items: center;
|
|
808
808
|
flex-wrap: nowrap;
|
|
809
809
|
gap: var(--u-gap-small);
|
|
810
|
-
flex
|
|
810
|
+
flex: 1;
|
|
811
|
+
min-width: 0;
|
|
811
812
|
}
|
|
812
813
|
.u-ai-chat__input-toolbar-right {
|
|
813
814
|
display: flex;
|
|
@@ -860,6 +861,32 @@
|
|
|
860
861
|
.u-ai-chat__input-attach:hover {
|
|
861
862
|
color: var(--u-color-primary);
|
|
862
863
|
}
|
|
864
|
+
.u-ai-chat__input-clear-wrap {
|
|
865
|
+
flex-shrink: 0;
|
|
866
|
+
display: inline-flex;
|
|
867
|
+
line-height: 0;
|
|
868
|
+
}
|
|
869
|
+
.u-ai-chat__input-clear-wrap.is-disabled {
|
|
870
|
+
opacity: 0.4;
|
|
871
|
+
pointer-events: none;
|
|
872
|
+
}
|
|
873
|
+
.u-ai-chat__input-clear {
|
|
874
|
+
color: var(--u-text-color-assist);
|
|
875
|
+
cursor: pointer;
|
|
876
|
+
font-size: 18px;
|
|
877
|
+
}
|
|
878
|
+
.u-ai-chat__input-clear:hover {
|
|
879
|
+
color: var(--u-color-danger);
|
|
880
|
+
}
|
|
881
|
+
.u-ai-chat__input-usage {
|
|
882
|
+
min-width: 0;
|
|
883
|
+
overflow: hidden;
|
|
884
|
+
text-overflow: ellipsis;
|
|
885
|
+
white-space: nowrap;
|
|
886
|
+
font-size: var(--u-font-size-main-small);
|
|
887
|
+
color: var(--u-text-color-assist);
|
|
888
|
+
line-height: 1.4;
|
|
889
|
+
}
|
|
863
890
|
.u-ai-chat__input-stop {
|
|
864
891
|
display: block;
|
|
865
892
|
width: 10px;
|
package/dist/index.d.ts
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import _sfc_main$1 from "./components/ai-orb/ai-orb.js";
|
|
2
2
|
import _sfc_main from "./components/ai-chat/ai-chat.js";
|
|
3
|
-
import { ChatAttachment, ChatMessage, ChatQueuedMessage, ChatTool, ChatToolCall, ChatToolContext, ChatToolRenderProps, ChatTransport, ChatTransportHandlers, ChatTransportRequest, ToolCallStatus } from "./chat/types.js";
|
|
3
|
+
import { ChatAttachment, ChatMessage, ChatQueuedMessage, ChatTokenUsage, ChatTool, ChatToolCall, ChatToolContext, ChatToolRenderProps, ChatTransport, ChatTransportHandlers, ChatTransportRequest, ToolCallStatus } from "./chat/types.js";
|
|
4
4
|
import { ChatModel, ChatModelOption, ChatProvider, ChatReasoningLevel } from "./providers/types.js";
|
|
5
5
|
import { AiChatEmits, AiChatExposed, AiChatProps, _AiChatExposed } from "./types/ai-chat.js";
|
|
6
6
|
import { AiOrbEmits, AiOrbExposed, AiOrbProps, AiOrbReaction, AiOrbStatus } from "./types/ai-orb.js";
|
|
@@ -10,4 +10,4 @@ import { OpenAITransport, OpenAITransportOptions, createOpenAITransport } from "
|
|
|
10
10
|
import "./chat/index.js";
|
|
11
11
|
import { AskQuestionAnswer, AskQuestionArgs, AskQuestionItem, AskQuestionResult } from "./tools/ask-question/ask-question.js";
|
|
12
12
|
import "./tools/index.js";
|
|
13
|
-
export { type AiChatEmits, type AiChatExposed, type AiChatProps, type AiOrbEmits, type AiOrbExposed, type AiOrbProps, type AiOrbReaction, type AiOrbStatus, type AskQuestionAnswer, type AskQuestionArgs, type AskQuestionItem, type AskQuestionResult, ChatAttachment, ChatMessage, type ChatModel, type ChatModelOption, type ChatProvider, ChatQueuedMessage, type ChatReasoningLevel, ChatTool, ChatToolCall, ChatToolContext, ChatToolRenderProps, ChatTransport, ChatTransportHandlers, ChatTransportRequest, OpenAITransport, OpenAITransportOptions, ToolCallStatus, _sfc_main as UAiChat, _sfc_main$1 as UAiOrb, UseChatOptions, type _AiChatExposed, createOpenAITransport, useChat };
|
|
13
|
+
export { type AiChatEmits, type AiChatExposed, type AiChatProps, type AiOrbEmits, type AiOrbExposed, type AiOrbProps, type AiOrbReaction, type AiOrbStatus, type AskQuestionAnswer, type AskQuestionArgs, type AskQuestionItem, type AskQuestionResult, ChatAttachment, ChatMessage, type ChatModel, type ChatModelOption, type ChatProvider, ChatQueuedMessage, type ChatReasoningLevel, ChatTokenUsage, ChatTool, ChatToolCall, ChatToolContext, ChatToolRenderProps, ChatTransport, ChatTransportHandlers, ChatTransportRequest, OpenAITransport, OpenAITransportOptions, ToolCallStatus, _sfc_main as UAiChat, _sfc_main$1 as UAiOrb, UseChatOptions, type _AiChatExposed, createOpenAITransport, useChat };
|
package/dist/types/ai-chat.d.ts
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { ChatAttachment, ChatMessage, ChatQueuedMessage, ChatTool, ChatToolCall, ChatTransport } from "../chat/types.js";
|
|
1
|
+
import { ChatAttachment, ChatMessage, ChatQueuedMessage, ChatTokenUsage, ChatTool, ChatToolCall, ChatTransport } from "../chat/types.js";
|
|
2
2
|
import { ChatModelOption } from "../providers/types.js";
|
|
3
3
|
import { Ref } from "vue";
|
|
4
4
|
import { DeconstructValue } from "@veltra/utils";
|
|
@@ -36,6 +36,11 @@ interface AiChatProps {
|
|
|
36
36
|
maxAttachmentSize?: number;
|
|
37
37
|
/** 透传给内部 MarkdownRender 的属性 */
|
|
38
38
|
rendererProps?: Record<string, unknown>;
|
|
39
|
+
/**
|
|
40
|
+
* 是否展示 token 用量明细(缓存命中 / 未命中;缺字段不显示)。
|
|
41
|
+
* 默认 false:仅在拿到 usage 时显示会话累计「总 token」。接口未返回 usage 时不展示。
|
|
42
|
+
*/
|
|
43
|
+
tokenUsageDetail?: boolean;
|
|
39
44
|
}
|
|
40
45
|
interface AiChatEmits {
|
|
41
46
|
/** 消息列表变化 */
|
|
@@ -60,8 +65,12 @@ interface _AiChatExposed {
|
|
|
60
65
|
abort: () => void;
|
|
61
66
|
/** 重新生成最后一条 assistant 回复 */
|
|
62
67
|
regenerate: () => void;
|
|
63
|
-
/**
|
|
68
|
+
/** 清空消息、待发送队列与 token 统计(生成中会先中止) */
|
|
64
69
|
clear: () => void;
|
|
70
|
+
/** 当前会话累计 token(从未收到 usage 时为 null) */
|
|
71
|
+
tokenUsage: Ref<ChatTokenUsage | null>;
|
|
72
|
+
/** 最近一轮用户对话的 token(含工具多轮请求;该轮无 usage 时为 null) */
|
|
73
|
+
lastTurnUsage: Ref<ChatTokenUsage | null>;
|
|
65
74
|
/** 待发送消息队列(会话进行中提交的消息按序排队,收尾后 FIFO 自动接续) */
|
|
66
75
|
queue: Ref<ChatQueuedMessage[]>;
|
|
67
76
|
/** 立即执行队列中的某条:中断当前会话并插队为下一条 */
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@veltra/ai",
|
|
3
|
-
"version": "2.1.
|
|
3
|
+
"version": "2.1.4",
|
|
4
4
|
"homepage": "https://github.com/cabinet-fe/ultra-ui#readme",
|
|
5
5
|
"bugs": {
|
|
6
6
|
"url": "https://github.com/cabinet-fe/ultra-ui/issues"
|
|
@@ -39,11 +39,11 @@
|
|
|
39
39
|
"markstream-vue": "^2.0.0"
|
|
40
40
|
},
|
|
41
41
|
"peerDependencies": {
|
|
42
|
-
"@veltra/compositions": "^1.6.
|
|
43
|
-
"@veltra/desktop": "^1.6.
|
|
42
|
+
"@veltra/compositions": "^1.6.4",
|
|
43
|
+
"@veltra/desktop": "^1.6.4",
|
|
44
44
|
"@veltra/icons": "^1.5.0",
|
|
45
|
-
"@veltra/styles": "^1.6.
|
|
46
|
-
"@veltra/utils": "^1.6.
|
|
45
|
+
"@veltra/styles": "^1.6.4",
|
|
46
|
+
"@veltra/utils": "^1.6.4",
|
|
47
47
|
"vue": ">=3.5.41"
|
|
48
48
|
}
|
|
49
49
|
}
|