From 60e2402affff7f347d445aafba9832cae3113d76 Mon Sep 17 00:00:00 2001 From: jxxghp Date: Tue, 16 Jun 2026 23:29:58 +0800 Subject: [PATCH] =?UTF-8?q?feat:=20=E4=BC=98=E5=8C=96=20AgentAssistantWidg?= =?UTF-8?q?et=20=E7=BB=84=E4=BB=B6=E7=9A=84=E6=A0=B7=E5=BC=8F=E5=92=8C?= =?UTF-8?q?=E7=BB=93=E6=9E=84=EF=BC=8C=E5=A2=9E=E5=BC=BA=E5=8F=AF=E8=AF=BB?= =?UTF-8?q?=E6=80=A7=E5=92=8C=E7=94=A8=E6=88=B7=E4=BD=93=E9=AA=8C?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/AgentAssistantWidget.vue | 122 ++++++++++++++++++------ 1 file changed, 91 insertions(+), 31 deletions(-) diff --git a/src/components/AgentAssistantWidget.vue b/src/components/AgentAssistantWidget.vue index 256acf12..a951a47d 100644 --- a/src/components/AgentAssistantWidget.vue +++ b/src/components/AgentAssistantWidget.vue @@ -182,7 +182,8 @@ function normalizeHistorySessions(value: unknown) { return { sessionId: sessionIdValue, - title: typeof item?.title === 'string' && item.title.trim() ? item.title.trim() : buildSessionHistoryTitle(messages), + title: + typeof item?.title === 'string' && item.title.trim() ? item.title.trim() : buildSessionHistoryTitle(messages), createdAt: Number(item?.createdAt) || firstMessageTime, updatedAt: Number(item?.updatedAt) || lastMessageTime, messages, @@ -295,10 +296,7 @@ function upsertCurrentSessionHistory() { messages: storedMessages, } - historySessions.value = [ - nextSession, - ...historySessions.value.filter(item => item.sessionId !== sessionId.value), - ] + historySessions.value = [nextSession, ...historySessions.value.filter(item => item.sessionId !== sessionId.value)] .sort((a, b) => b.updatedAt - a.updatedAt) .slice(0, MAX_HISTORY_SESSIONS) @@ -941,26 +939,13 @@ onScopeDispose(() => { :z-index="2103" >
{{ t('agentAssistant.history') }} - - {{ t('agentAssistant.newChat') }} -
@@ -1283,7 +1268,6 @@ onScopeDispose(() => { position: fixed; z-index: 2101; overflow: hidden; - overscroll-behavior: contain; background: rgb(var(--v-theme-surface)); block-size: var(--agent-assistant-viewport-height, 100dvh) !important; border-inline-start: 1px solid rgba(var(--v-border-color), var(--v-border-opacity)); @@ -1292,6 +1276,7 @@ onScopeDispose(() => { inset-block-start: 0; inset-inline-end: 0; max-block-size: var(--agent-assistant-viewport-height, 100dvh) !important; + overscroll-behavior: contain; } .agent-assistant-shell { @@ -1341,10 +1326,10 @@ onScopeDispose(() => { } .agent-assistant-history-menu { + overflow: hidden; border: 1px solid rgba(var(--v-border-color), var(--v-border-opacity)); border-radius: 12px; inline-size: min(22rem, calc(100vw - 2rem)); - overflow: hidden; } .agent-assistant-history-menu__header { @@ -1436,8 +1421,8 @@ onScopeDispose(() => { } .agent-assistant-messages { - overscroll-behavior: contain; overflow-y: auto; + overscroll-behavior: contain; padding-block: 1rem calc(env(safe-area-inset-bottom, 0px) + 12rem); padding-inline: 1rem; scrollbar-width: thin; @@ -1510,7 +1495,10 @@ onScopeDispose(() => { .agent-assistant-message__bubble { border: 1px solid rgba(var(--v-border-color), var(--v-border-opacity)); border-radius: 16px; + font-size: 0.92rem; + line-height: 1.55; max-inline-size: min(100%, 34rem); + min-inline-size: 0; padding-block: 0.75rem; padding-inline: 0.85rem; } @@ -1671,8 +1659,8 @@ onScopeDispose(() => { gap: 0.45rem; margin-block-end: 0.55rem; max-block-size: 8rem; - overscroll-behavior: contain; overflow-y: auto; + overscroll-behavior: contain; scrollbar-width: thin; } @@ -1839,6 +1827,26 @@ onScopeDispose(() => { overflow-wrap: anywhere; word-break: break-word; + :deep(h1), + :deep(h2), + :deep(h3) { + margin-block: 0.5rem; + font-weight: 600; + line-height: 1.3; + } + + :deep(h1) { + font-size: 1.5rem; + } + + :deep(h2) { + font-size: 1.25rem; + } + + :deep(h3) { + font-size: 1.1rem; + } + :deep(p) { margin-block-end: 0.5rem; } @@ -1852,19 +1860,21 @@ onScopeDispose(() => { text-decoration: underline; } + :deep(code) { + border-radius: 4px; + background: rgba(var(--v-theme-on-surface), 0.08); + font-family: monospace; + padding-block: 0.1rem; + padding-inline: 0.3rem; + } + :deep(pre) { overflow: auto; padding: 0.75rem; border-radius: 10px; background: rgba(var(--v-theme-on-surface), 0.08); margin-block: 0.5rem; - } - - :deep(code) { - border-radius: 4px; - background: rgba(var(--v-theme-on-surface), 0.08); - padding-block: 0.1rem; - padding-inline: 0.3rem; + max-inline-size: 100%; } :deep(pre code) { @@ -1875,12 +1885,62 @@ onScopeDispose(() => { :deep(ul), :deep(ol) { margin-block-end: 0.5rem; - padding-inline-start: 1.25rem; + padding-inline-start: 1.5rem; + } + + :deep(ul) { + list-style-type: disc; + } + + :deep(ol) { + list-style-type: decimal; } :deep(li) { + display: list-item; margin-block: 0.25rem; } + + :deep(blockquote) { + border-inline-start: 4px solid rgba(var(--v-border-color), 0.2); + color: rgba(var(--v-theme-on-surface), 0.74); + font-style: italic; + margin-block: 0.5rem; + padding-inline-start: 1rem; + } + + :deep(table) { + display: block; + overflow-x: auto; + border-collapse: collapse; + inline-size: max-content; + max-inline-size: 100%; + margin-block: 0.5rem; + } + + :deep(th), + :deep(td) { + border: 1px solid rgba(var(--v-border-color), 0.16); + padding-block: 0.4rem; + padding-inline: 0.65rem; + text-align: start; + } + + :deep(th) { + background: rgba(var(--v-border-color), 0.08); + font-weight: 600; + } + + :deep(hr) { + border: none; + border-block-start: 1px solid rgba(var(--v-border-color), 0.24); + margin-block: 1rem; + } + + :deep(img) { + block-size: auto; + max-inline-size: 100%; + } } @keyframes agent-typing {