fix: 修复研究助手首屏滚动与欢迎区布局

This commit is contained in:
yuxuanhui
2026-09-10 13:26:57 +08:00
parent 37e390a073
commit 1ba8d3ff3d
5 changed files with 98 additions and 25 deletions
+1
View File
@@ -33,6 +33,7 @@ export function AssistantDialogue({
timezone?: string;
jobs: Job[];
}) {
if (!messages.length) return null;
const sources = new Map(messages.map((message) => [message.id, message]));
const chats: Message[] = messages.map((message) => ({
id: message.id,
+17 -15
View File
@@ -10,7 +10,7 @@ import {
IconPlus,
IconChevronRight,
} from "@douyinfe/semi-icons";
import { contextLabel, contextReferences, researchPrompts } from "./workspace";
import { contextLabel, contextReferences } from "./workspace";
import { chatTransport } from "./transport";
import { runLabels } from "./types";
import type {
@@ -58,7 +58,7 @@ export function ChatPanel({
const [loading, setLoading] = useState(false);
const root = useRef<HTMLElement>(null);
const input = useRef<HTMLDivElement>(null);
const bottom = useRef<HTMLDivElement>(null);
const messagesViewport = useRef<HTMLDivElement>(null);
const previousFocus = useRef<HTMLElement | null>(null);
const seenChanges = useRef(new Set<string>());
const current = useRef({ conversationId, context });
@@ -206,7 +206,7 @@ export function ChatPanel({
const editor = input.current?.querySelector<HTMLElement>(
'[contenteditable="true"]',
);
if (editor) editor.focus();
if (editor) editor.focus({ preventScroll: true });
else
root.current
?.querySelector<HTMLButtonElement>('button[aria-label="收起研究助手"]')
@@ -226,7 +226,11 @@ export function ChatPanel({
};
}, [open]);
useEffect(() => {
if (open) bottom.current?.scrollIntoView({ block: "nearest" });
if (!open || !messagesViewport.current) return;
// Scroll only the message region; empty conversations always start at the welcome.
messagesViewport.current.scrollTop = chat.messages.length
? messagesViewport.current.scrollHeight
: 0;
}, [chat.messages, open]);
async function createConversation() {
@@ -409,7 +413,12 @@ export function ChatPanel({
/>
)}
{failure && <Banner type="danger" description={failure} />}
<div className="ai-messages" aria-live="polite" aria-busy={streaming}>
<div
ref={messagesViewport}
className="ai-messages"
aria-live="polite"
aria-busy={streaming}
>
{loading && <Spin />}
{!chat.messages.length && (
<div className="ai-empty">
@@ -428,7 +437,9 @@ export function ChatPanel({
开始新会话
</Button>
)}
<span>修改和任务操作会先展示预览,确认后执行。</span>
<p className="ai-empty-note">
修改和任务操作会先展示预览,确认后执行。
</p>
</div>
)}
<AssistantDialogue
@@ -460,7 +471,6 @@ export function ChatPanel({
)}
</div>
)}
<div ref={bottom} />
</div>
<footer className="ai-composer" ref={input}>
<div className="ai-context">{contextLabel(context)}</div>
@@ -477,14 +487,6 @@ export function ChatPanel({
busy={!!activeRun || streaming}
onSubmit={() => void send()}
onStop={activeRun ? () => void stop() : undefined}
prompts={researchPrompts(context)}
hint={
context.page === "datasets"
? context.unsaved_field_selection
? "字段选择尚未保存;请先保存为固定研究输入。未保存备注不会发送。"
: "引用随当前页面更新,未保存备注不会发送。"
: "引用随当前页面更新。修改和任务操作会先展示预览,确认后执行。"
}
/>
</footer>
</aside>
+7 -3
View File
@@ -146,7 +146,7 @@
border-radius: 8px;
}
.ai-empty {
margin: 32px 0;
margin: 16px 0;
color: var(--muted);
line-height: 24px;
}
@@ -159,8 +159,7 @@
.ai-empty .semi-button {
margin-top: var(--space-3);
}
.ai-empty span {
display: block;
.ai-empty-note {
font-size: 12px;
line-height: 20px;
margin-top: var(--space-4);
@@ -307,9 +306,14 @@
border-radius: 8px;
background: var(--semi-color-ai-background-top);
}
/* The outer message region owns scrolling, including welcome and run status. */
.ai-messages .semi-ai-chat-dialogue {
height: auto;
min-height: 0;
}
.ai-messages .semi-ai-chat-dialogue-list {
overflow: visible;
}
.ai-messages .semi-ai-chat-dialogue-inner {
min-width: 0;
}