diff --git a/ui/src/api/API_README.md b/ui/src/api/API_README.md
index 70cc8d6979c..3a731e97d8f 100644
--- a/ui/src/api/API_README.md
+++ b/ui/src/api/API_README.md
@@ -465,6 +465,13 @@ Admin 调试接口在 `admin/workspace/conversation.ts`，正式 Chat 接口在
 使用各自请求客户端。面板 `common/get-api.ts` 仅按 ChatType 选择完整 API，不拼 URL。
 Chat 协议及认证接口见 [chat/README.md](chat/README.md)。
 
+历史消息和流式聚合复用 `@/api/types` 的 `ChatContent`，定义在 `types/chat-log.ts`；
+`ChatLogRecord.question` 与 `messages` 使用该内容项类型，扩展字段保留为 `unknown`。
+Chat、Workspace 调试和 System 调试的记录分页及详情均声明 `ChatLogRecord` 返回类型，
+消息列表依赖从 `ConversationApiAdapter` 选取对应接口约定。
+`conversation-panel/core/stream.ts` 的 `ConversationStream<Chunk>` 通过回调推断分片类型，
+兼容对话内容项、工具调试和纯文本生成；流读取器使用原生 `Response` 与字节流类型。
+
 ### 通用文件上传
 
 `admin/file.ts` 与 `chat/file.ts` 分别提供 `postUploadFile(file, sourceId, sourceType, onProgress?)`，
diff --git a/ui/src/api/admin/system/resource-management/application/conversation.ts b/ui/src/api/admin/system/resource-management/application/conversation.ts
index d81fe97c20a..e642e2aa0d2 100644
--- a/ui/src/api/admin/system/resource-management/application/conversation.ts
+++ b/ui/src/api/admin/system/resource-management/application/conversation.ts
@@ -1,3 +1,4 @@
+import type { ChatLogRecord, PortalConversationSummary } from '@/api/types'
 import { get, post, put, del, postStream } from '@/api/admin/core/request'
 import { ADMIN_API_BASE_PATH as adminApiBase } from '@/api/constants'
 
@@ -16,34 +17,29 @@ const postCancelConversationMessage = (chatId: string, applicationId: string) =>
 
 /** 恢复对话消息流。 */
 const postResumeConversationMessage = (chatId: string, chatRecordId: string, applicationId: string) =>
-  postStream(
-    adminApiBase,
-    `${getPrefix(applicationId)}/chat/${chatId}/chat_record/${chatRecordId}/resume_chat_message`,
-  )
+  postStream(adminApiBase, `${getPrefix(applicationId)}/chat/${chatId}/chat_record/${chatRecordId}/resume_chat_message`)
 
 /** 获取历史会话分页。 */
 const getConversationPage = (page: number, size: number, applicationId: string) =>
-  get(`${getPrefix(applicationId)}/historical_conversation/${page}/${size}`)
+  get<{ records: PortalConversationSummary[] }>(`${getPrefix(applicationId)}/historical_conversation/${page}/${size}`)
 
 /** 获取会话记录详情。 */
 const getConversationRecordDetail = (chatId: string, chatRecordId: string, applicationId: string) =>
-  get(`${getPrefix(applicationId)}/chat/${chatId}/chat_record/${chatRecordId}`)
+  get<ChatLogRecord>(`${getPrefix(applicationId)}/chat/${chatId}/chat_record/${chatRecordId}`)
 
 /** 获取会话记录分页。 */
 const getConversationRecordPage = (chatId: string, page: number, size: number, applicationId: string) =>
-  get(`${getPrefix(applicationId)}/historical_conversation_record/${chatId}/${page}/${size}`)
+  get<{ records: ChatLogRecord[] }>(`${getPrefix(applicationId)}/historical_conversation_record/${chatId}/${page}/${size}`)
 
 /** 删除会话。 */
-const deleteConversation = (chatId: string, applicationId: string) =>
-  del(`${getPrefix(applicationId)}/historical_conversation/${chatId}`)
+const deleteConversation = (chatId: string, applicationId: string) => del(`${getPrefix(applicationId)}/historical_conversation/${chatId}`)
 
 /** 修改会话信息。 */
 const putConversation = (chatId: string, data: unknown, applicationId: string) =>
   put(`${getPrefix(applicationId)}/historical_conversation/${chatId}`, data)
 
 /** 使用指定智能体将语音转换为文字。 */
-const postSpeechToText = (applicationId: string, data: unknown) =>
-  post(`${getPrefix(applicationId)}/speech_to_text`, data)
+const postSpeechToText = (applicationId: string, data: unknown) => post(`${getPrefix(applicationId)}/speech_to_text`, data)
 
 export default {
   getConversationOpen,
diff --git a/ui/src/api/admin/workspace/conversation.ts b/ui/src/api/admin/workspace/conversation.ts
index f55047ec514..641575b1e16 100644
--- a/ui/src/api/admin/workspace/conversation.ts
+++ b/ui/src/api/admin/workspace/conversation.ts
@@ -1,3 +1,4 @@
+import type { ChatLogRecord, PortalConversationSummary } from '@/api/types'
 import { get, post, put, del, postStream } from '../core/request'
 import { getWorkspaceId } from '@/utils/resource-context'
 import { ADMIN_API_BASE_PATH as adminApiBase } from '@/api/constants'
@@ -24,22 +25,23 @@ const postResumeConversationMessage = (chatId: string, chatRecordId: string, app
 const getConversationPage = (page: number, size: number, applicationId?: string) => {
   const wsId = getWorkspaceId()
   if (applicationId) {
-    return get(`/workspace/${wsId}/application/${applicationId}/historical_conversation/${page}/${size}`)
+    return get<{ records: PortalConversationSummary[] }>(`/workspace/${wsId}/application/${applicationId}/historical_conversation/${page}/${size}`)
   }
-  return get(`/workspace/${wsId}/historical_conversation/${page}/${size}`)
+  return get<{ records: PortalConversationSummary[] }>(`/workspace/${wsId}/historical_conversation/${page}/${size}`)
 }
 
- 
 const getConversationRecordDetail = (chatId: string, chatRecordId: string, applicationId?: string) =>
-  get(`/workspace/${getWorkspaceId()}/application/${applicationId}/chat/${chatId}/chat_record/${chatRecordId}`)
+  get<ChatLogRecord>(`/workspace/${getWorkspaceId()}/application/${applicationId}/chat/${chatId}/chat_record/${chatRecordId}`)
 
 /** 获取会话记录分页。 */
 const getConversationRecordPage = (chatId: string, page: number, size: number, applicationId?: string) => {
   const wsId = getWorkspaceId()
   if (applicationId) {
-    return get(`/workspace/${wsId}/application/${applicationId}/historical_conversation_record/${chatId}/${page}/${size}`)
+    return get<{ records: ChatLogRecord[] }>(
+      `/workspace/${wsId}/application/${applicationId}/historical_conversation_record/${chatId}/${page}/${size}`,
+    )
   }
-  return get(`/workspace/${wsId}/historical_conversation_record/${chatId}/${page}/${size}`)
+  return get<{ records: ChatLogRecord[] }>(`/workspace/${wsId}/historical_conversation_record/${chatId}/${page}/${size}`)
 }
 
 /** 删除会话。 */
diff --git a/ui/src/api/chat/conversation.ts b/ui/src/api/chat/conversation.ts
index 10f34b2be25..a71c61b6a81 100644
--- a/ui/src/api/chat/conversation.ts
+++ b/ui/src/api/chat/conversation.ts
@@ -1,7 +1,7 @@
 import { get, post, put, del, postStream } from './core/request'
 import type { ResponsePage } from './core/types'
 import { CHAT_API_BASE_PATH as chatApiBase } from '@/api/constants'
-import type { PortalConversationSummary } from '@/api/types'
+import type { ChatLogRecord, PortalConversationSummary } from '@/api/types'
 
 /** v3 对话接口均按智能体划分资源路径。 */
 const getApplicationPath = (applicationId: string) => `/v3/application/${applicationId}`
@@ -26,25 +26,21 @@ const getConversationPage = (applicationId: string, page: number, size: number)
 
 /** 获取门户单个智能体的历史会话分页（懒加载），仅返回摘要，支持摘要模糊搜索。 */
 const getPortalConversationPage = (applicationId: string, page: number, size: number, abstract?: string) =>
-  get<ResponsePage<PortalConversationSummary>>(
-    `/v3/portal/chat/${applicationId}/${page}/${size}`,
-    abstract ? { abstract } : undefined,
-  )
+  get<ResponsePage<PortalConversationSummary>>(`/v3/portal/chat/${applicationId}/${page}/${size}`, abstract ? { abstract } : undefined)
 
 /** 获取单条会话记录详情(含执行详情 execution_details、知识来源、tokens、耗时)。 */
 const getConversationRecordDetail = (applicationId: string, chatId: string, chatRecordId: string) =>
-  get(`${getApplicationPath(applicationId)}/chat/${chatId}/chat_record/${chatRecordId}`)
+  get<ChatLogRecord>(`${getApplicationPath(applicationId)}/chat/${chatId}/chat_record/${chatRecordId}`)
 
 /** 获取会话记录分页。 */
 const getConversationRecordPage = (applicationId: string, chatId: string, page: number, size: number) =>
-  get(`${getApplicationPath(applicationId)}/chat/${chatId}/chat_record/${page}/${size}`)
+  get<{ records: ChatLogRecord[] }>(`${getApplicationPath(applicationId)}/chat/${chatId}/chat_record/${page}/${size}`)
 
 /** 删除会话。 */
 const deleteConversation = (applicationId: string, chatId: string) => del(`${getApplicationPath(applicationId)}/chat/${chatId}`)
 
 /** 修改会话信息。 */
-const putConversation = (applicationId: string, chatId: string, data: unknown) =>
-  put(`${getApplicationPath(applicationId)}/chat/${chatId}`, data)
+const putConversation = (applicationId: string, chatId: string, data: unknown) => put(`${getApplicationPath(applicationId)}/chat/${chatId}`, data)
 
 /** 将语音转换为文字。 */
 const postSpeechToText = (applicationId: string, data: unknown) => post(`${getApplicationPath(applicationId)}/speech_to_text`, data)
diff --git a/ui/src/api/types/chat-log.ts b/ui/src/api/types/chat-log.ts
index 7f2cd3ab77b..48aa9161900 100644
--- a/ui/src/api/types/chat-log.ts
+++ b/ui/src/api/types/chat-log.ts
@@ -24,13 +24,33 @@ export interface ChatLog {
   update_time: string
 }
 
+/** 历史消息与流式分片共用的内容项，未约定的扩展字段保留为 unknown。 */
+export interface ChatContent {
+  type: string
+  id?: string
+  content?: string
+  name?: string
+  status?: string
+  arguments?: string
+  children?: ChatContent[]
+  workflowRunId?: string
+  extra?: unknown
+  form_field_list?: Dict<unknown>[]
+  form_content_format?: string
+  form_data?: Dict<unknown>
+  is_submit?: boolean
+  position?: unknown
+  chat_record_id?: string
+  [key: string]: unknown
+}
+
 /** 对话日志中的单条问答记录，仅列出前端使用的字段。 */
 export interface ChatLogRecord {
   id: string
   /** 提问内容项 */
-  question: Dict<unknown>
+  question: ChatContent
   /** 回答内容项列表 */
-  messages: Dict<unknown>[]
+  messages: ChatContent[]
   message_tokens?: number
   answer_tokens?: number
   run_time?: number
diff --git a/ui/src/components/COMPONENT_README.md b/ui/src/components/COMPONENT_README.md
index 33938d284d7..863907d8a8e 100644
--- a/ui/src/components/COMPONENT_README.md
+++ b/ui/src/components/COMPONENT_README.md
@@ -228,6 +228,35 @@ Element Plus 的 `v-infinite-scroll`。组件通过 `v-model` 管理已经加载
 首次加载或 `reset()` 请求第一页时，组件只显示加载状态；第一页完成且列表为空后才渲染 `empty`
 插槽，避免请求过程中短暂显示空状态。已有数据时继续渲染默认插槽，并在触底请求期间保留列表。
 
+### ReverseInfiniteScroll（对话模块）
+
+位于 `conversation-panel/core/reverse-infinite-scroll/index.vue`，由对话模块显式导入，
+不属于全局组件。内部使用 `el-scrollbar`，父级需要提供受限高度或纵向 Flex 剩余空间，
+外层不再额外包裹消息滚动容器。
+
+传入 `loading`、`hasMore`、`count` 和 `loadMore: () => Promise<boolean>`。页码、请求和
+历史数据前插由调用方维护；`loadMore` 在历史数据更新后返回 `true`，失败或没有新增数据返回
+`false`。组件不请求首页；首页由调用方加载，首次出现数据时自动定位到底部，距顶部 60px 时
+串行加载历史。内容不足一屏时继续补页，失败或未新增数据时停止自动补页。
+
+默认插槽放消息，`empty` 插槽放欢迎语或空状态，加载期间不显示空状态。
+首次加载使用整块遮罩；有消息时顶部预留状态行，加载期间使用 `mk-conversation-loading`
+展示加载动画。失败后可再次主动上滑重试，流式回复状态由消息列表自行渲染。
+历史消息前插后按滚动高度差补偿阅读位置，不要求消息设置额外的 DOM 属性。
+`count` 清零会重置定位状态，切换会话时应通过
+组件 `key` 重建实例，以隔离未结束的补页与定位操作。
+
+底部定位与跟随复用 `conversation-panel/core/scroll.ts` 的 `Scroll`；其他消息容器也从此文件导入，
+容器卸载或替换时调用 `destroy()` 清理监听和动画帧。
+公开 `scrollToBottom()` 强制定位到底部、`followBottom()` 仅在用户位于底部附近时跟随。
+聊天列表订阅流式进度后调用 `followBottom()`；只读日志无需订阅。
+`message-list` 和 `log-message-list` 使用该容器，保留各自的消息正文与底部信息；聊天列表
+自行展示流式圆点，欢迎语和日志空状态放入 `empty` 插槽。日志列表不注入发送能力。
+消息 Store 的 `loadMore()` 在新增历史记录时返回 `true`，空页、失败或未执行时返回 `false`，
+直接传给滚动容器。新会话及重置时 `hasMore` 为 `false`；已有会话主动加载首页，成功后再更新
+`hasMore`。首页失败后通过重新加载首页重试，不从下一页继续。
+Chat、Portal 和 Display 面板直接放置消息列表，并以当前会话 ID 为 `key`，不再包裹额外滚动层。
+
 ### MkListItem
 
 统一列表行、选中态及悬浮操作区。仅自定义内容时传 `active` 并监听 `click` 即可。
diff --git a/ui/src/components/global/mk-infinite-scroll/index.vue b/ui/src/components/global/mk-infinite-scroll/index.vue
index 0c5a05df3f6..ed4d7161da6 100644
--- a/ui/src/components/global/mk-infinite-scroll/index.vue
+++ b/ui/src/components/global/mk-infinite-scroll/index.vue
@@ -105,9 +105,9 @@ defineExpose({ reset })
   <div v-loading="loading && !dataList.length" class="min-h-full">
     <slot v-if="dataList.length" />
     <slot v-else-if="firstPageLoaded" name="empty" />
-    <div ref="triggerRef" aria-live="polite" class="flex-center py-4 shrink-0 text-sm text-N600">
-      <span v-if="loading && dataList.length">加载中...</span>
-      <span v-else-if="showFinishedText">没有更多了</span>
+    <div ref="triggerRef" aria-live="polite" class="flex-center py-4 shrink-0">
+      <span v-if="loading && dataList.length"><span class="mk-conversation-loading" /></span>
+      <span v-else-if="showFinishedText" class="text-sm text-N600">没有更多了</span>
     </div>
   </div>
 </template>
diff --git a/ui/src/conversation-panel/components/content/items/tool/Patch.vue b/ui/src/conversation-panel/components/content/items/tool/Patch.vue
index 602ede478bb..5d9b007c703 100644
--- a/ui/src/conversation-panel/components/content/items/tool/Patch.vue
+++ b/ui/src/conversation-panel/components/content/items/tool/Patch.vue
@@ -68,13 +68,13 @@
 </template>
 
 <script setup lang="ts">
-import { computed, reactive, ref, watch, nextTick, onMounted } from 'vue'
+import { computed, reactive, ref, watch, nextTick, onMounted, onBeforeUnmount } from 'vue'
 import Loading from '@/conversation-panel/loading/index.vue'
 import ScrollDiff from './components/ScrollDiff.vue'
 import { parsePatch } from './patch/parsePatch'
 import type { PatchFileStatus } from './patch/patchTypes'
 import { extractPartialJsonField } from './extract-partial-json'
-import { Scroll } from '@/conversation-panel/core/stream'
+import { Scroll } from '@/conversation-panel/core/scroll'
 
 const props = defineProps<{ content: any; loading: boolean; expanded: boolean }>()
 
@@ -82,6 +82,7 @@ const multiScrollRef = ref<HTMLElement>()
 let multiScroll: Scroll | null = null
 
 function initScroll() {
+  multiScroll?.destroy()
   if (multiScrollRef.value) {
     multiScroll = new Scroll(multiScrollRef.value)
     multiScroll.forceBottom()
@@ -99,11 +100,14 @@ watch(
       await nextTick()
       initScroll()
     } else {
+      multiScroll?.destroy()
       multiScroll = null
     }
   },
 )
 
+onBeforeUnmount(() => multiScroll?.destroy())
+
 const patchDiff = computed(() => {
   const raw = props.content.arguments
   if (!raw) return ''
diff --git a/ui/src/conversation-panel/components/content/items/tool/components/ScrollDiff.vue b/ui/src/conversation-panel/components/content/items/tool/components/ScrollDiff.vue
index a9884be954d..0540afc0d95 100644
--- a/ui/src/conversation-panel/components/content/items/tool/components/ScrollDiff.vue
+++ b/ui/src/conversation-panel/components/content/items/tool/components/ScrollDiff.vue
@@ -5,10 +5,10 @@
 </template>
 
 <script setup lang="ts">
-import { ref, watch, onMounted, nextTick } from 'vue'
+import { ref, watch, onMounted, onBeforeUnmount, nextTick } from 'vue'
 import FileDiff from '../patch/FileDiff.vue'
 import type { PatchFileInfo } from '../patch/patchTypes'
-import { Scroll } from '@/conversation-panel/core/stream'
+import { Scroll } from '@/conversation-panel/core/scroll'
 
 const props = defineProps<{ file: PatchFileInfo }>()
 
@@ -22,6 +22,8 @@ onMounted(() => {
   }
 })
 
+onBeforeUnmount(() => scroll?.destroy())
+
 watch(
   () => props.file.additions,
   () => {
diff --git a/ui/src/conversation-panel/components/log-message-list/index.ts b/ui/src/conversation-panel/components/log-message-list/index.ts
index 65e6dabee3e..7bffc9ceff6 100644
--- a/ui/src/conversation-panel/components/log-message-list/index.ts
+++ b/ui/src/conversation-panel/components/log-message-list/index.ts
@@ -24,9 +24,9 @@ export function createLogMessageListStore(deps: LogMessageListDeps) {
   const messages = ref<ChatMessage[]>([])
   const loading = ref(false)
 
-  const pageSize = 20
+  const pageSize = 30
   const currentPage = ref(1)
-  const hasMore = ref(true)
+  const hasMore = ref(false)
 
   // 接口按最新在前分页:页内 reverse 成正序,更旧的页拼到前面
   const loadMessages = async (cid: string, page = 1) => {
@@ -47,8 +47,10 @@ export function createLogMessageListStore(deps: LogMessageListDeps) {
       messages.value = page === 1 ? result : [...result, ...messages.value]
       currentPage.value = page
       hasMore.value = records.length >= pageSize
+      return records.length > 0
     } catch {
       // 静默处理
+      return false
     } finally {
       loading.value = false
     }
@@ -59,15 +61,15 @@ export function createLogMessageListStore(deps: LogMessageListDeps) {
     const cid = getChatId()
     messages.value = []
     currentPage.value = 1
-    hasMore.value = true
+    hasMore.value = false
     if (!cid) return
     await loadMessages(cid, 1)
   }
 
-  const loadMore = async () => {
+  const loadMore = async (): Promise<boolean> => {
     const cid = getChatId()
-    if (!hasMore.value || loading.value || !cid) return
-    await loadMessages(cid, currentPage.value + 1)
+    if (!hasMore.value || loading.value || !cid) return false
+    return loadMessages(cid, currentPage.value + 1)
   }
 
   return { messages, loading, hasMore, load, loadMore }
diff --git a/ui/src/conversation-panel/components/log-message-list/index.vue b/ui/src/conversation-panel/components/log-message-list/index.vue
index 69308559234..7d9c7669d37 100644
--- a/ui/src/conversation-panel/components/log-message-list/index.vue
+++ b/ui/src/conversation-panel/components/log-message-list/index.vue
@@ -1,93 +1,24 @@
 <script setup lang="ts">
-import { ref, computed, watch, onMounted, nextTick } from 'vue'
-import { Loading as LoadingIcon } from '@element-plus/icons-vue'
 import ContentList from '../content-list/index.vue'
 import MessageFooter from '../message-footer/index.vue'
-import { Scroll } from '../../core/stream'
+import ReverseInfiniteScroll from '../../core/reverse-infinite-scroll/index.vue'
 import { useLogMessageListStore } from './index'
 
 const { messages, loading, hasMore, loadMore } = useLogMessageListStore()
-
-// 整块遮罩:load 会先清空消息,故无消息时的加载即首页加载
-const fullLoading = computed(() => loading.value && messages.value.length === 0)
-
-const msgBoxRef = ref<HTMLElement | null>(null)
-let scroll: Scroll | null = null
-onMounted(() => {
-  if (msgBoxRef.value) scroll = new Scroll(msgBoxRef.value)
-})
-
-// 首页加载完成(消息从无到有)→ 定位到最新一条
-watch(
-  () => messages.value.length,
-  (len, prevLen) => {
-    if (len > 0 && !prevLen) nextTick(() => scroll?.forceBottom())
-  },
-)
-
-// 上滑到顶加载更早的记录,并保持当前阅读位置不跳动
-const onScroll = async () => {
-  const el = msgBoxRef.value
-  if (!el || el.scrollTop > 60 || !hasMore.value || loading.value) return
-  const prevHeight = el.scrollHeight
-  await loadMore()
-  await nextTick()
-  el.scrollTop += el.scrollHeight - prevHeight
-}
 </script>
 
 <template>
-  <!-- 只读会话记录:首页加载整块遮罩,上滑加载更多时顶部小转圈 -->
-  <div ref="msgBoxRef" v-loading="fullLoading" @scroll="onScroll">
-    <template v-if="messages.length > 0">
-      <div v-if="loading" class="log-message-list__more">
-        <el-icon class="is-loading" :size="18"><LoadingIcon /></el-icon>
-      </div>
-
-      <div v-for="(msg, i) in messages" :key="msg.id || i" :class="[msg.role === 'USER' ? 'user' : 'assistant']">
+  <ReverseInfiniteScroll :loading="loading" :has-more="hasMore" :count="messages.length" :load-more="loadMore">
+    <template v-for="(msg, i) in messages" :key="msg.id || i">
+      <div :class="[msg.role === 'USER' ? 'user' : 'assistant']">
         <ContentList :content-list="msg.content" />
         <!-- 助手消息底部信息栏(知识来源/执行详情/tokens/耗时) -->
         <MessageFooter v-if="msg.role === 'ASSISTANT' && msg.record" :message="msg" />
       </div>
     </template>
 
-    <el-empty v-else-if="!loading" class="flex-1" description="暂无对话记录" :image-size="80" />
-  </div>
+    <template #empty>
+      <el-empty class="flex-1" description="暂无对话记录" :image-size="80" />
+    </template>
+  </ReverseInfiniteScroll>
 </template>
-
-<style scoped lang="scss">
-// .log-message-list {
-//   flex: 1;
-//   min-height: 0;
-//   overflow-y: auto;
-//   scrollbar-width: thin;
-//   display: flex;
-//   flex-direction: column;
-//   align-items: center;
-// }
-
-// .log-message-list__more {
-//   display: flex;
-//   justify-content: center;
-//   padding: 4px 0 10px;
-//   color: var(--t3, #909399);
-// }
-
-// .msg-row {
-//   display: flex;
-//   flex-direction: column;
-//   gap: 6px;
-//   margin-bottom: 10px;
-//   max-width: 800px;
-//   width: 100%;
-//   box-sizing: border-box;
-// }
-// .msg-row.user {
-//   align-items: flex-end;
-//   flex-direction: row-reverse;
-//   max-width: 85%;
-// }
-// .msg-row.assistant {
-//   align-items: flex-start;
-// }
-</style>
diff --git a/ui/src/conversation-panel/components/message-list/index.ts b/ui/src/conversation-panel/components/message-list/index.ts
index da3f22f645a..09a1c547fa2 100644
--- a/ui/src/conversation-panel/components/message-list/index.ts
+++ b/ui/src/conversation-panel/components/message-list/index.ts
@@ -1,23 +1,21 @@
 import { ref, inject, type InjectionKey } from 'vue'
 import { nanoid } from 'nanoid'
+import type { ChatLogRecord, Dict } from '@/api/types'
 import { aggregators } from '../../core/aggregators'
 import { ConversationStream } from '../../core/stream'
-import type { ChatMessage, ChatRecordMeta, SendMessageOptions } from '../../core/types'
+import type { ChatMessage, ChatRecordMeta, ConversationApiAdapter, SendMessageOptions, StreamChunk } from '../../core/types'
 
-export interface MessageListDeps {
-  pageRecords: (chatId: string, page: number, size: number) => Promise<any>
-  recordDetail: (chatId: string, chatRecordId: string) => Promise<any>
-  chatMessage: (chatId: string, data: any) => Promise<Response>
-  resumeMessage: (chatId: string, chatRecordId: string) => Promise<Response>
-  cancel: (chatId: string) => Promise<any>
-  uploadFile: (file: File, chatId: string, onProgress?: (percent: number) => void) => Promise<string>
+export interface MessageListDeps extends Pick<
+  ConversationApiAdapter,
+  'pageRecords' | 'recordDetail' | 'chatMessage' | 'resumeMessage' | 'cancel' | 'uploadFile'
+> {
   // 只读获取当前会话 id(单一数据源在 conversation-list)。必须无副作用:不可惰性创建,
   // 否则无会话时的 stop/cancel/loadMore 会凭空生成 id 并误请求后端。
   getChatId: () => string
 }
 
 // 从后端 chat_record(分页项或详情接口,均为 reset_chat_record 结构)提取底部信息栏数据
-const buildRecordMeta = (raw: any): ChatRecordMeta => ({
+const buildRecordMeta = (raw?: ChatLogRecord | null): ChatRecordMeta => ({
   messageTokens: raw?.message_tokens || 0,
   answerTokens: raw?.answer_tokens || 0,
   runTime: raw?.run_time || 0,
@@ -33,16 +31,16 @@ export function createMessageListStore(deps: MessageListDeps) {
   const streamLoading = ref(false)
 
   // ── 分页 ─────────────────────────────────────────────
-  const pageSize = 20
+  const pageSize = 30
   const currentPage = ref(1)
-  const hasMore = ref(true)
+  const hasMore = ref(false)
 
   const loadMessages = async (cid: string, page = 1) => {
     loading.value = true
     try {
       const res = await pageRecords(cid, page, pageSize)
       const records = (res?.records || []).reverse()
-      const result = records.flatMap((record: any) => [
+      const result = records.flatMap((record): ChatMessage[] => [
         { role: 'USER', content: [record.question], id: record.id + '_USER' },
         {
           role: 'ASSISTANT',
@@ -55,27 +53,29 @@ export function createMessageListStore(deps: MessageListDeps) {
       messages.value = page === 1 ? result : [...result, ...messages.value]
       currentPage.value = page
       hasMore.value = records.length >= pageSize
-    } catch (e) {
+      return records.length > 0
+    } catch {
       // 静默处理
+      return false
     } finally {
       loading.value = false
     }
   }
 
-  const loadMore = async () => {
+  const loadMore = async (): Promise<boolean> => {
     const cid = getChatId()
-    if (!hasMore.value || loading.value || !cid) return
-    await loadMessages(cid, currentPage.value + 1)
+    if (!hasMore.value || loading.value || !cid) return false
+    return loadMessages(cid, currentPage.value + 1)
   }
 
   const resetMessages = () => {
     messages.value = []
     currentPage.value = 1
-    hasMore.value = true
+    hasMore.value = false
   }
 
   // 对话结束后拉取该条记录详情,填充底部信息栏(tokens/耗时/知识来源/执行详情)
-  const getChatRecord = async (target: any, cid: string) => {
+  const getChatRecord = async (target: ChatMessage, cid: string) => {
     const rid = target?.recordId
     if (!cid || !rid) return
     try {
@@ -86,15 +86,15 @@ export function createMessageListStore(deps: MessageListDeps) {
   }
 
   // ── 流式聚合 ─────────────────────────────────────────
-  const appendChunk = (message: ChatMessage, chunk: any) => {
+  const appendChunk = (message: ChatMessage, chunk: StreamChunk) => {
     if (!chunk) return
     const contentArray = Array.isArray(chunk.content) ? chunk.content : chunk.type ? [chunk] : null
     if (!contentArray) return
-    contentArray.forEach((item: any) => {
+    contentArray.forEach((item) => {
       if (!item?.type) return
       const aggregator = aggregators[item.type]
       if (!aggregator) return
-      const index = message.content.findIndex((c: any) => c.id === item.id && c.type === item.type)
+      const index = message.content.findIndex((content) => content.id === item.id && content.type === item.type)
       if (index >= 0) message.content[index] = aggregator(message.content[index], item)
       else message.content.push(aggregator({}, item))
     })
@@ -128,18 +128,14 @@ export function createMessageListStore(deps: MessageListDeps) {
     })
 
   // onNext 逐段回调,onComplete(e?) 结束回调:e 为空表示正常结束,有值表示失败
-  const runStream = (
-    request: () => Promise<Response>,
-    onNext: (chunk: any) => void,
-    onComplete: (e?: any) => void,
-  ) => {
+  const runStream = (request: () => Promise<Response>, onNext: (chunk: StreamChunk) => void, onComplete: (e?: unknown) => void) => {
     closeStream()
     streamLoading.value = true
     request()
-      .then((response: any) => {
+      .then((response) => {
         currentStream = new ConversationStream(
           response,
-          (chunk: any) => {
+          (chunk: StreamChunk) => {
             onNext(chunk)
             emitProgress()
           },
@@ -163,19 +159,16 @@ export function createMessageListStore(deps: MessageListDeps) {
     const cid = opts.chatId || getChatId()
     if (!cid) return
 
-    let target: any
     if (opts.newQuestion) {
       messages.value.push({ role: 'USER', content: [opts.questionContent ?? opts.message], id: nanoid() })
       messages.value.push({ role: 'ASSISTANT', content: [], id: '' })
-      target = messages.value[messages.value.length - 1]
-    } else {
-      target =
-        messages.value.find((m: any) => m.id === `${opts.chatRecordId}_ASSISTANT`) ||
-        messages.value[messages.value.length - 1]
     }
+    const target = opts.newQuestion
+      ? messages.value[messages.value.length - 1]
+      : messages.value.find((message) => message.id === `${opts.chatRecordId}_ASSISTANT`) || messages.value[messages.value.length - 1]
     if (!target) return
 
-    const payload: any = { message: opts.message, stream: true, re_chat: opts.reChat ?? false }
+    const payload: Dict<unknown> = { message: opts.message, stream: true, re_chat: opts.reChat ?? false }
     if (opts.formData) payload.form_data = opts.formData
     if (opts.position !== undefined) payload.position = opts.position
     if (opts.chatRecordId) payload.chat_record_id = opts.chatRecordId
@@ -200,12 +193,12 @@ export function createMessageListStore(deps: MessageListDeps) {
   const stop = () => {
     const cid = getChatId()
     if (!currentStream || !cid) return
-    cancelApi(cid).catch(() => { })
+    cancelApi(cid).catch(() => {})
   }
   // 硬取消:卸载/离开时断开本地流并通知后端
   const cancel = () => {
     const cid = getChatId()
-    if (closeStream() && cid) cancelApi(cid).catch(() => { })
+    if (closeStream() && cid) cancelApi(cid).catch(() => {})
   }
 
   // ── 切换会话:由 conversation-list 主动调用(list 先写好 currentChatId 再调本函数)──
diff --git a/ui/src/conversation-panel/components/message-list/index.vue b/ui/src/conversation-panel/components/message-list/index.vue
index 6995d6954d9..3a6da4c4226 100644
--- a/ui/src/conversation-panel/components/message-list/index.vue
+++ b/ui/src/conversation-panel/components/message-list/index.vue
@@ -1,69 +1,45 @@
 <script setup lang="ts">
-import { ref, computed, onMounted, onBeforeUnmount, watch, nextTick } from 'vue'
-import { Loading as LoadingIcon } from '@element-plus/icons-vue'
+import { ref, onBeforeUnmount } from 'vue'
 import ContentList from '../content-list/index.vue'
 import MessageFooter from '../message-footer/index.vue'
-import Loading from '../../loading/index.vue'
-import { Scroll } from '../../core/stream'
+import ReverseInfiniteScroll from '../../core/reverse-infinite-scroll/index.vue'
 import { useMessageListStore } from './index'
 
 defineProps<{ appName?: string }>()
 
 const { messages, loading, streamLoading, hasMore, loadMore, onStreamProgress } = useMessageListStore()
+const scrollRef = ref<InstanceType<typeof ReverseInfiniteScroll>>()
 
-// 整块遮罩:切换会话会先清空消息,故无消息时的接口加载即首页加载
-const fullLoading = computed(() => loading.value && messages.value.length === 0)
-
-const msgBoxRef = ref<HTMLElement | null>(null)
-let scroll: Scroll | null = null
-let offProgress: (() => void) | null = null
-
-onMounted(() => {
-  if (msgBoxRef.value) scroll = new Scroll(msgBoxRef.value)
-  // 流式分片(on_next)→ 吸底。适配所有流来源(发送 / 续传),不依赖 message-input。
-  offProgress = onStreamProgress(() => nextTick(() => scroll?.scrollBottom()))
-})
-onBeforeUnmount(() => offProgress?.())
-
-// 新增气泡(提问 / 新回答)→ 吸底
-watch(
-  () => messages.value.length,
-  () => nextTick(() => scroll?.scrollBottom()),
-)
-
-// 上滑到顶 → 加载更多
-const onScroll = () => {
-  const el = msgBoxRef.value
-  if (el && el.scrollTop <= 60 && hasMore.value) loadMore()
-}
+// 流式分片只在用户仍位于底部时跟随，新增气泡由滚动容器监听 count。
+const offProgress = onStreamProgress(() => void scrollRef.value?.followBottom())
+onBeforeUnmount(offProgress)
 </script>
-<template>
-  <!-- 接口加载:无消息时(首页)整块遮罩,有消息时(加载更多)顶部小转圈;对话加载:底部小点 -->
-  <div ref="msgBoxRef" v-loading="fullLoading" @scroll="onScroll">
-    <template v-if="messages.length > 0">
-      <div v-if="loading" class="message-list__more">
-        <el-icon class="is-loading" :size="18"><LoadingIcon /></el-icon>
-      </div>
 
-      <div v-for="(msg, i) in messages" :key="msg.id || i" :class="[msg.role === 'USER' ? 'user' : 'assistant']">
+<template>
+  <ReverseInfiniteScroll ref="scrollRef" class="p-4" :loading="loading" :has-more="hasMore" :count="messages.length" :load-more="loadMore">
+    <template v-for="(msg, i) in messages" :key="msg.id || i">
+      <div :class="[msg.role === 'USER' ? 'user' : 'assistant']">
         <ContentList :content-list="msg.content" />
         <!-- 助手消息结束后显示底部信息栏(知识来源/执行详情/tokens/耗时) -->
         <MessageFooter v-if="msg.role === 'ASSISTANT' && (msg.write_ed || msg.record)" :message="msg" />
       </div>
-
-      <div v-if="streamLoading" class="msg-row assistant">
-        <Loading :size="18" />
-      </div>
     </template>
 
-    <div v-else-if="!loading" class="welcome">
-      <slot name="welcome">
-        <p class="welcome-title">{{ appName }}</p>
-        <p class="welcome-sub">有什么可以帮你的？</p>
-      </slot>
+    <div v-if="streamLoading" class="msg-row assistant">
+      <span class="mk-conversation-loading" />
     </div>
-  </div>
+
+    <template #empty>
+      <div class="welcome">
+        <slot name="welcome">
+          <p class="welcome-title">{{ appName }}</p>
+          <p class="welcome-sub">有什么可以帮你的？</p>
+        </slot>
+      </div>
+    </template>
+  </ReverseInfiniteScroll>
 </template>
+
 <style scoped lang="scss">
 // .message-list {
 //   flex: 1;
diff --git a/ui/src/conversation-panel/core/aggregators.ts b/ui/src/conversation-panel/core/aggregators.ts
index cc05c1b0db0..727df2d72b4 100644
--- a/ui/src/conversation-panel/core/aggregators.ts
+++ b/ui/src/conversation-panel/core/aggregators.ts
@@ -1,6 +1,14 @@
+import type { ChatContent } from '@/api/types'
+
+interface ContentAggregator {
+  // 分片提供 id 时，所有聚合器均优先保留该 id，供调用方继续使用稳定消息键。
+  (previous: Partial<ChatContent> | undefined, chunk: Partial<ChatContent> & { id: string }): ChatContent & { id: string }
+  (previous: Partial<ChatContent> | undefined, chunk: Partial<ChatContent>): ChatContent
+}
+
 // 流式分片聚合:按 id+type 把分片累积成一条内容项(TEXT/REASONING/FAILURE/TOOL/FORM/PROGRESS/GROUP)。
 // GROUP 为通用分组容器,分片以嵌套 children 携带组内内容,组内同样按 id+type 合并(可再嵌套 GROUP)。
-const TEXT = (prev: any = {}, chunk: any) => {
+const TEXT = (prev: Partial<ChatContent> = {}, chunk: Partial<ChatContent>) => {
   return {
     type: 'TEXT',
     id: chunk.id ?? prev.id,
@@ -10,7 +18,7 @@ const TEXT = (prev: any = {}, chunk: any) => {
   }
 }
 
-const REASONING = (prev: any, chunk: any) => {
+const REASONING = (prev: Partial<ChatContent> = {}, chunk: Partial<ChatContent>) => {
   return {
     type: 'REASONING',
     id: chunk.id ?? prev.id,
@@ -21,7 +29,7 @@ const REASONING = (prev: any, chunk: any) => {
   }
 }
 
-const FAILURE = (prev: any, chunk: any) => {
+const FAILURE = (prev: Partial<ChatContent> = {}, chunk: Partial<ChatContent>) => {
   return {
     type: 'FAILURE',
     id: chunk.id ?? prev.id,
@@ -31,7 +39,7 @@ const FAILURE = (prev: any, chunk: any) => {
   }
 }
 
-const TOOL = (prev: any, chunk: any) => {
+const TOOL = (prev: Partial<ChatContent> = {}, chunk: Partial<ChatContent>) => {
   return {
     type: 'TOOL',
     id: chunk.id ?? prev.id,
@@ -44,7 +52,7 @@ const TOOL = (prev: any, chunk: any) => {
   }
 }
 
-const FORM = (prev: any, chunk: any) => {
+const FORM = (prev: Partial<ChatContent> = {}, chunk: Partial<ChatContent>) => {
   return {
     type: 'FORM',
     id: chunk.id ?? prev.id,
@@ -60,7 +68,7 @@ const FORM = (prev: any, chunk: any) => {
   }
 }
 
-const PROGRESS = (prev: any = {}, chunk: any) => {
+const PROGRESS = (prev: Partial<ChatContent> = {}, chunk: Partial<ChatContent>) => {
   return {
     type: 'PROGRESS',
     id: chunk.id ?? prev.id,
@@ -71,19 +79,19 @@ const PROGRESS = (prev: any = {}, chunk: any) => {
 }
 
 // 组内子项:按 id+type 合并分片,规则与顶层一致,嵌套 GROUP 由其聚合函数递归处理
-const mergeChildren = (children: any[] = [], chunkChildren: any[] = []) => {
+const mergeChildren = (children: ChatContent[] = [], chunkChildren: ChatContent[] = []): ChatContent[] => {
   const mergedChildren = [...children]
-  chunkChildren.forEach((item: any) => {
+  chunkChildren.forEach((item) => {
     const aggregator = aggregators[item?.type]
     if (!aggregator) return
-    const index = mergedChildren.findIndex((c: any) => c.id === item.id && c.type === item.type)
-    if (index >= 0) mergedChildren[index] = aggregator(mergedChildren[index], item)
+    const index = mergedChildren.findIndex((content) => content.id === item.id && content.type === item.type)
+    if (index >= 0) mergedChildren[index] = aggregator(mergedChildren[index] ?? {}, item)
     else mergedChildren.push(aggregator({}, item))
   })
   return mergedChildren
 }
 
-const GROUP = (prev: any = {}, chunk: any) => {
+const GROUP = (prev: Partial<ChatContent> = {}, chunk: Partial<ChatContent>) => {
   return {
     type: 'GROUP',
     id: chunk.id ?? prev.id,
@@ -95,7 +103,7 @@ const GROUP = (prev: any = {}, chunk: any) => {
   }
 }
 
-export const aggregators: Record<string, (prev: any, chunk: any) => any> = {
+export const aggregators = {
   TEXT,
   REASONING,
   FAILURE,
@@ -103,4 +111,4 @@ export const aggregators: Record<string, (prev: any, chunk: any) => any> = {
   FORM,
   PROGRESS,
   GROUP,
-}
+} as Record<string, ContentAggregator>
diff --git a/ui/src/conversation-panel/core/reverse-infinite-scroll/index.ts b/ui/src/conversation-panel/core/reverse-infinite-scroll/index.ts
new file mode 100644
index 00000000000..f63486b0c26
--- /dev/null
+++ b/ui/src/conversation-panel/core/reverse-infinite-scroll/index.ts
@@ -0,0 +1,92 @@
+import { computed, nextTick, onBeforeUnmount, onMounted, ref, watch } from 'vue'
+import type { ScrollbarInstance } from 'element-plus'
+import { Scroll } from '../scroll'
+
+export interface ReverseInfiniteScrollProps {
+  loading: boolean
+  hasMore: boolean
+  count: number
+  loadMore: () => Promise<boolean>
+}
+
+/** 顶部加载历史消息，底部定位与跟随交给共用 Scroll。 */
+export function useReverseInfiniteScroll(props: Readonly<ReverseInfiniteScrollProps>) {
+  const scrollbarRef = ref<ScrollbarInstance>()
+  const requesting = ref(false)
+  const initialLoading = computed(() => props.loading && props.count === 0)
+  const loadingMore = computed(() => props.count > 0 && (props.loading || requesting.value))
+  let scroll: Scroll | undefined
+  let initialized = false
+  let previousTop = 0
+
+  async function scrollToBottom() {
+    await nextTick()
+    scroll?.forceBottom()
+  }
+
+  async function followBottom() {
+    await nextTick()
+    if (!requesting.value) scroll?.scrollBottom()
+  }
+
+  // 只在成功新增历史记录后继续补满视口，失败或空页停止自动请求。
+  async function loadOlder() {
+    const wrap = scrollbarRef.value?.wrapRef
+    if (!wrap || props.loading || requesting.value || !props.hasMore || !props.count) return
+    const previousHeight = wrap.scrollHeight
+    const previousCount = props.count
+    requesting.value = true
+    let loaded = false
+    try {
+      loaded = await props.loadMore()
+      await nextTick()
+      if (scrollbarRef.value?.wrapRef !== wrap) return
+      scrollbarRef.value.setScrollTop(wrap.scrollTop + wrap.scrollHeight - previousHeight)
+    } catch {
+      // 下次主动上滑时可重试。
+    } finally {
+      requesting.value = false
+    }
+    if (loaded && props.count > previousCount) await fillViewport()
+  }
+
+  async function fillViewport() {
+    const wrap = scrollbarRef.value?.wrapRef
+    if (wrap && wrap.clientHeight > 0 && wrap.scrollHeight <= wrap.clientHeight + 1) await loadOlder()
+  }
+
+  function onScroll({ scrollTop }: { scrollTop: number }) {
+    const scrollingUp = scrollTop < previousTop
+    previousTop = scrollTop
+    // 只响应向上滚动，前插补偿产生的向下位移不触发下一页。
+    if (scrollingUp && scrollTop <= 60) void loadOlder()
+  }
+
+  async function initialize() {
+    if (!props.count) initialized = false
+    if (!scroll || initialized || !props.count || props.loading) return
+    initialized = true
+    await scrollToBottom()
+    await fillViewport()
+  }
+
+  watch(
+    () => [props.count, props.loading] as const,
+    async ([count], [previousCount]) => {
+      if (!initialized || !count) await initialize()
+      else if (count !== previousCount) await followBottom()
+    },
+  )
+
+  onMounted(() => {
+    const wrap = scrollbarRef.value?.wrapRef
+    if (wrap) scroll = new Scroll(wrap)
+    void initialize()
+  })
+  onBeforeUnmount(() => {
+    scroll?.destroy()
+    scroll = undefined
+  })
+
+  return { scrollbarRef, initialLoading, loadingMore, onScroll, scrollToBottom, followBottom }
+}
diff --git a/ui/src/conversation-panel/core/reverse-infinite-scroll/index.vue b/ui/src/conversation-panel/core/reverse-infinite-scroll/index.vue
new file mode 100644
index 00000000000..f89d6b1b212
--- /dev/null
+++ b/ui/src/conversation-panel/core/reverse-infinite-scroll/index.vue
@@ -0,0 +1,31 @@
+<script setup lang="ts">
+import { useReverseInfiniteScroll, type ReverseInfiniteScrollProps } from './index'
+
+defineOptions({ name: 'ReverseInfiniteScroll' })
+const props = defineProps<ReverseInfiniteScrollProps>()
+defineSlots<{
+  default?: () => unknown
+  empty?: () => unknown
+}>()
+
+const { scrollbarRef, initialLoading, loadingMore, onScroll, scrollToBottom, followBottom } = useReverseInfiniteScroll(props)
+
+defineExpose({ scrollToBottom, followBottom })
+</script>
+
+<template>
+  <div v-loading="initialLoading" class="min-h-0 flex-1 overflow-hidden">
+    <el-scrollbar ref="scrollbarRef" wrap-class="[overflow-anchor:none]" view-class="min-h-full flex-column" @scroll="onScroll">
+      <div class="min-h-full flex-1 flex-column">
+        <template v-if="count > 0">
+          <!-- 固定预留状态行，加载提示切换时不改变消息位置。 -->
+          <div class="flex-center py-4 shrink-0">
+            <span v-if="loadingMore" class="mk-conversation-loading" />
+          </div>
+          <slot />
+        </template>
+        <slot v-else-if="!loading" name="empty" />
+      </div>
+    </el-scrollbar>
+  </div>
+</template>
diff --git a/ui/src/conversation-panel/core/scroll.ts b/ui/src/conversation-panel/core/scroll.ts
new file mode 100644
index 00000000000..6347ca68afd
--- /dev/null
+++ b/ui/src/conversation-panel/core/scroll.ts
@@ -0,0 +1,55 @@
+/** 消息容器的底部跟随：用户上滑后停止跟随，回到底部附近恢复。 */
+export class Scroll {
+  private element: HTMLElement
+  private bottomSuction = true
+  private programmaticTop?: number
+  private animationFrame?: number
+  private destroyed = false
+
+  constructor(element: HTMLElement) {
+    this.element = element
+    element.addEventListener('scroll', this.onScroll)
+  }
+
+  private onScroll = () => {
+    if (this.programmaticTop !== undefined && Math.abs(this.element.scrollTop - this.programmaticTop) < 1) {
+      this.programmaticTop = undefined
+      return
+    }
+    this.programmaticTop = undefined
+    this.bottomSuction = this.element.scrollHeight - this.element.scrollTop <= this.element.clientHeight + 15
+    // 用户离开底部后，不再执行上一轮强制定位的动画帧。
+    if (!this.bottomSuction) this.cancelFrame()
+  }
+
+  private cancelFrame() {
+    if (this.animationFrame !== undefined) cancelAnimationFrame(this.animationFrame)
+    this.animationFrame = undefined
+  }
+
+  /** 仅在用户仍位于底部附近时跟随新增内容。 */
+  scrollBottom() {
+    if (this.destroyed || !this.bottomSuction) return
+    this.element.scrollTop = this.element.scrollHeight
+    this.programmaticTop = this.element.scrollTop
+  }
+
+  /** 强制定位最新消息，并在下一帧补一次布局后的定位。 */
+  forceBottom() {
+    if (this.destroyed) return
+    this.cancelFrame()
+    this.bottomSuction = true
+    this.scrollBottom()
+    this.animationFrame = requestAnimationFrame(() => {
+      this.animationFrame = undefined
+      this.scrollBottom()
+    })
+  }
+
+  /** 容器卸载或替换时释放滚动监听和待执行的动画帧。 */
+  destroy() {
+    this.destroyed = true
+    this.element.removeEventListener('scroll', this.onScroll)
+    this.cancelFrame()
+  }
+}
diff --git a/ui/src/conversation-panel/core/stream.ts b/ui/src/conversation-panel/core/stream.ts
index 77ee6806377..fd5e4351124 100644
--- a/ui/src/conversation-panel/core/stream.ts
+++ b/ui/src/conversation-panel/core/stream.ts
@@ -1,19 +1,22 @@
+import type { StreamChunk } from './types'
+
 // SSE 流解析:逐段 data: {...} 回调 onNext，遇 [DONE]/结束/异常回调 onComplete(e?)。
-export class ConversationStream {
-  private response: any
-  private onNext: (chunk: any) => void
-  private onComplete: (e?: any) => void
+export class ConversationStream<Chunk = StreamChunk> {
+  private response: Response
+  private onNext: (chunk: unknown) => void
+  private onComplete: (e?: unknown) => void
   private cancelled = false
   private completed = false
-  private reader: ReadableStreamDefaultReader<any> | null = null
+  private reader: ReadableStreamDefaultReader<Uint8Array> | null = null
 
-  constructor(response: any, onNext: (chunk: any) => void, onComplete: (e?: any) => void) {
+  constructor(response: Response, onNext: (chunk: Chunk) => void, onComplete: (e?: unknown) => void) {
     this.response = response
     this.onComplete = onComplete
-    this.onNext = onNext
+    // JSON 在解析边界是 unknown，由调用方的分片协议约束回调类型。
+    this.onNext = (chunk) => onNext(chunk as Chunk)
   }
 
-  private complete(e?: any) {
+  private complete(e?: unknown) {
     if (this.completed || this.cancelled) return
     this.completed = true
     this.onComplete(e)
@@ -21,7 +24,7 @@ export class ConversationStream {
 
   async start() {
     try {
-      this.reader = this.response.body?.getReader()
+      this.reader = this.response.body?.getReader() ?? null
       if (!this.reader) {
         this.complete()
         return
@@ -57,9 +60,9 @@ export class ConversationStream {
             }
 
             try {
-              const chunk = JSON.parse(data)
+              const chunk: unknown = JSON.parse(data)
               this.onNext(chunk)
-            } catch (e) {
+            } catch {
               // Skip invalid JSON
             }
           }
@@ -73,9 +76,9 @@ export class ConversationStream {
           const data = trimmed.slice(5).trim()
           if (data !== '[DONE]') {
             try {
-              const chunk = JSON.parse(data)
+              const chunk: unknown = JSON.parse(data)
               this.onNext(chunk)
-            } catch (e) {
+            } catch {
               // Skip invalid JSON
             }
           }
@@ -103,50 +106,3 @@ export class ConversationStream {
     }
   }
 }
-
-// 消息容器“贴底吸附”滚动:用户上滑离底后不再自动吸底，回到底部附近恢复吸附。
-export class Scroll {
-  private bottomSuction: boolean
-  private isProgrammaticScroll?: boolean
-  private element: HTMLElement
-
-  constructor(element: HTMLElement) {
-    this.bottomSuction = true
-    this.isProgrammaticScroll = false
-    this.element = element
-    this.initEventListener()
-  }
-
-  private initEventListener() {
-    this.element.addEventListener('scroll', () => {
-      if (this.isProgrammaticScroll) {
-        this.isProgrammaticScroll = undefined
-      } else {
-        if (this.element.scrollHeight - this.element.scrollTop <= this.element.clientHeight + 15) {
-          this.bottomSuction = true
-          this.isProgrammaticScroll = true
-        } else {
-          this.isProgrammaticScroll = undefined
-          this.bottomSuction = false
-        }
-      }
-    })
-  }
-
-  scrollBottom() {
-    if (this.bottomSuction) {
-      this.element.scrollTop = this.element.scrollHeight
-      this.isProgrammaticScroll = true
-    }
-  }
-
-  forceBottom() {
-    this.bottomSuction = true
-    this.isProgrammaticScroll = true
-    this.element.scrollTop = this.element.scrollHeight
-    requestAnimationFrame(() => {
-      this.element.scrollTop = this.element.scrollHeight
-      this.isProgrammaticScroll = true
-    })
-  }
-}
diff --git a/ui/src/conversation-panel/core/types.ts b/ui/src/conversation-panel/core/types.ts
index bd169cc5959..056f3092a53 100644
--- a/ui/src/conversation-panel/core/types.ts
+++ b/ui/src/conversation-panel/core/types.ts
@@ -1,4 +1,5 @@
 import type { CHAT_TYPE } from './enums'
+import type { ChatContent, ChatLogRecord, Dict } from '@/api/types'
 
 /** 侧栏账户入口展示的当前用户，由 Chat / Debug 入口按各自的用户 Store 提供。 */
 export interface ConversationAccount {
@@ -20,53 +21,57 @@ export interface ChatRecordMeta {
   answerTokens: number
   runTime: number
   knowledgeCount: number
-  executionDetails: any[]
+  executionDetails: NonNullable<ChatLogRecord['execution_details']>
 }
 
 export interface ChatMessage {
   role: 'USER' | 'ASSISTANT'
-  content: any[]
+  content: ChatContent[]
   id: string
   write_ed?: boolean
   recordId?: string // 对应后端 chat_record id(用于拉取执行详情)
   record?: ChatRecordMeta // 底部信息栏数据
 }
 
-export interface StreamChunk {
-  content?: any[]
+interface StreamContentBatch {
+  type?: undefined
+  content?: ChatContent[]
   chat_id?: string
   chat_record_id?: string
-  [key: string]: any
+  [key: string]: unknown
 }
 
+/** SSE 支持批量内容分片，也支持直接发送单个内容项。 */
+export type StreamChunk = StreamContentBatch | ChatContent
+
 export type ChatType = (typeof CHAT_TYPE)[keyof typeof CHAT_TYPE]
 
 // 通用「发起/续跑一次对话」的参数。message-input、表单节点等任何能发起对话的地方共用。
 export interface SendMessageOptions {
   chatId?: string // 目标会话 id;新建会话时由调用方(message-input)惰性生成后传入,缺省沿用当前已加载会话
-  message: any // 后端 message dict {content,type,image_list?,...}
+  message: ChatContent // 后端 message dict {content,type,image_list?,...}
   newQuestion: boolean // true=新增 question(新 USER 气泡 + 新 answer 消息);false=续跑已存在的 assistant 消息
-  questionContent?: any // newQuestion=true 时 USER 气泡展示的 content 项，缺省用 message
+  questionContent?: ChatContent // newQuestion=true 时 USER 气泡展示的 content 项，缺省用 message
   reChat?: boolean
-  formData?: Record<string, any>
-  position?: any
+  formData?: Dict<unknown>
+  position?: unknown
   chatRecordId?: string | null
   chunkId?: string | null
-  onNext?: (chunk: any) => void // 逐段回调
-  onComplete?: (e?: any) => void // 结束回调:e 为空=正常结束,有值=失败
+  onNext?: (chunk: StreamChunk) => void // 逐段回调
+  onComplete?: (e?: unknown) => void // 结束回调:e 为空=正常结束,有值=失败
 }
 
 // 模式适配:chat / debug 只在这些 API 上有差异,由 view/{mode} 组装时注入。
 export interface ConversationApiAdapter {
-  pageConversations: (page: number, size: number) => Promise<any>
-  pageRecords: (chatId: string, page: number, size: number) => Promise<any>
-  recordDetail: (chatId: string, chatRecordId: string) => Promise<any>
-  remove: (chatId: string) => Promise<any>
-  rename: (chatId: string, data: { abstract: string }) => Promise<any>
-  chatMessage: (chatId: string, data: any) => Promise<Response>
+  pageConversations: (page: number, size: number) => Promise<{ records?: Conversation[] } | null | undefined>
+  pageRecords: (chatId: string, page: number, size: number) => Promise<{ records?: ChatLogRecord[] } | null | undefined>
+  recordDetail: (chatId: string, chatRecordId: string) => Promise<ChatLogRecord | null | undefined>
+  remove: (chatId: string) => Promise<unknown>
+  rename: (chatId: string, data: { abstract: string }) => Promise<unknown>
+  chatMessage: (chatId: string, data: Dict<unknown>) => Promise<Response>
   resumeMessage: (chatId: string, chatRecordId: string) => Promise<Response>
   uploadFile: (file: File, chatId: string, onProgress?: (percent: number) => void) => Promise<string>
-  cancel: (chatId: string) => Promise<any>
+  cancel: (chatId: string) => Promise<unknown>
 }
 
 // 说明:各组件 store 的类型不在此集中声明,而是各组件 index.ts 用 ReturnType 自导出
diff --git a/ui/src/conversation-panel/main/chat-panel/index.vue b/ui/src/conversation-panel/main/chat-panel/index.vue
index 3ceeac3b9c3..4a436f25ca8 100644
--- a/ui/src/conversation-panel/main/chat-panel/index.vue
+++ b/ui/src/conversation-panel/main/chat-panel/index.vue
@@ -16,9 +16,7 @@ const handleDrop = (e: DragEvent) => input.addFiles(e.dataTransfer?.files)
   <main class="mk-conversation-main" @drop.prevent="handleDrop" @dragover.prevent>
     <!-- 头部可被替换(如 debug 用 debug header);默认普通 chat header -->
     <slot name="header"><ChatHeader /></slot>
-    <div class="min-h-0 flex-1 overflow-y-auto">
-      <MessageList :app-name="list.appInfo.value?.name || 'AI 助手'" />
-    </div>
+    <MessageList :key="list.currentChatId.value" :app-name="list.appInfo.value?.name || 'AI 助手'" />
 
     <footer class="flex-center shrink-0 p-4"><MessageInput /></footer>
   </main>
diff --git a/ui/src/conversation-panel/main/display-panel/index.vue b/ui/src/conversation-panel/main/display-panel/index.vue
index 01dd4dc182e..5d3d7591687 100644
--- a/ui/src/conversation-panel/main/display-panel/index.vue
+++ b/ui/src/conversation-panel/main/display-panel/index.vue
@@ -8,6 +8,6 @@ const list = useConversationListStore()
   <!-- 只显示变体:仅 message-list,无 header、无 message-input(不发起对话)。
        里面的 form 拿不到发送能力时自动只读。 -->
   <main class="mk-conversation-main">
-    <MessageList :app-name="list.appInfo.value?.name || 'AI 助手'" />
+    <MessageList :key="list.currentChatId.value" :app-name="list.appInfo.value?.name || 'AI 助手'" />
   </main>
 </template>
diff --git a/ui/src/conversation-panel/main/portal-chat-panel/index.vue b/ui/src/conversation-panel/main/portal-chat-panel/index.vue
index 174ffd00f44..14aaf31c4c4 100644
--- a/ui/src/conversation-panel/main/portal-chat-panel/index.vue
+++ b/ui/src/conversation-panel/main/portal-chat-panel/index.vue
@@ -20,7 +20,7 @@ const handleDrop = (e: DragEvent) => input.addFiles(e.dataTransfer?.files)
   <main class="mk-conversation-main" @drop.prevent="handleDrop" @dragover.prevent>
     <!-- 收起侧栏时标题栏的新建对话与侧栏一致：没有当前智能体时选择智能体 -->
     <ChatHeader :new-conversation="portalList.newConversation" />
-    <MessageList v-if="portalList.currentApplicationId.value" :app-name="list.appInfo.value?.name || 'AI 助手'" />
+    <MessageList :key="list.currentChatId.value" v-if="portalList.currentApplicationId.value" :app-name="list.appInfo.value?.name || 'AI 助手'" />
     <!-- 未确定智能体时不显示欢迎语：分组加载完成且没有可用智能体时显示空状态 -->
     <div v-else class="flex-center min-h-0 flex-1">
       <MkEmpty v-if="portalList.isApplicationGroupsLoaded.value" description="暂无可用智能体" />
diff --git a/ui/src/conversation-panel/view/chat/index.vue b/ui/src/conversation-panel/view/chat/index.vue
index e7764bd712f..af450d45634 100644
--- a/ui/src/conversation-panel/view/chat/index.vue
+++ b/ui/src/conversation-panel/view/chat/index.vue
@@ -1,18 +1,3 @@
-<template>
-  <!-- chat 视图自组装:provide 各组件 store + 布局壳 + 左/主/右三区。窄屏抽屉、宽屏挤压 -->
-  <ConversationLayout
-    :left-open="bundle.list.leftSideOpen.value"
-    :right-open="bundle.detail.rightSideOpen.value"
-    :left-mode="leftMode"
-    :right-mode="rightMode"
-    @mask-click="closeDrawers"
-  >
-    <template #left><ConversationList /></template>
-    <template #main><ChatPanel /></template>
-    <template #right><ExecutionDetail /></template>
-  </ConversationLayout>
-</template>
-
 <script setup lang="ts">
 import { ref, computed, watch, onMounted, onBeforeUnmount, provide } from 'vue'
 import ConversationLayout from '../../core/layout/index.vue'
@@ -62,6 +47,21 @@ watch([() => bundle.list.currentChatId.value, () => bundle.list.composerResetSig
 })
 </script>
 
+<template>
+  <!-- chat 视图自组装:provide 各组件 store + 布局壳 + 左/主/右三区。窄屏抽屉、宽屏挤压 -->
+  <ConversationLayout
+    :left-open="bundle.list.leftSideOpen.value"
+    :right-open="bundle.detail.rightSideOpen.value"
+    :left-mode="leftMode"
+    :right-mode="rightMode"
+    @mask-click="closeDrawers"
+  >
+    <template #left><ConversationList /></template>
+    <template #main><ChatPanel /></template>
+    <template #right><ExecutionDetail /></template>
+  </ConversationLayout>
+</template>
+
 <style lang="scss">
 @use '../../index.scss';
 </style>
diff --git a/ui/src/conversation-panel/view/log/index.vue b/ui/src/conversation-panel/view/log/index.vue
index 01583eb52ce..eba61782bc7 100644
--- a/ui/src/conversation-panel/view/log/index.vue
+++ b/ui/src/conversation-panel/view/log/index.vue
@@ -28,8 +28,7 @@ const props = withDefaults(defineProps<{ chatId: string; applicationId?: string;
 // 不注入 MESSAGE_LIST_KEY,表单等内容项拿不到发送能力即自动只读。
 const msgs = createLogMessageListStore({
   // 降序取(最新在前),store 页内 reverse 成正序、上滑加载更旧
-  pageRecords: (cid, p, s) =>
-    props.chatLogApi.getChatRecordLog(props.applicationId || '', cid, { currentPage: p, pageSize: s }, false),
+  pageRecords: (cid, p, s) => props.chatLogApi.getChatRecordLog(props.applicationId || '', cid, { currentPage: p, pageSize: s }, false),
   getChatId: () => props.chatId,
 })
 const detail = createExecutionDetailStore()
@@ -49,15 +48,10 @@ watch(
 </script>
 
 <template>
-  <ConversationLayout
-    :left-open="false"
-    :right-open="detail.rightSideOpen.value"
-    right-mode="drawer"
-    @mask-click="detail.closeRightSide()"
-  >
+  <ConversationLayout :left-open="false" :right-open="detail.rightSideOpen.value" right-mode="drawer" @mask-click="detail.closeRightSide()">
     <template #main>
       <main class="mk-conversation-main">
-        <LogMessageList />
+        <LogMessageList :key="props.chatId" />
       </main>
     </template>
     <template #right><ExecutionDetail /></template>
diff --git a/ui/src/styles/STYLE_README.md b/ui/src/styles/STYLE_README.md
index 8c72753f78d..297672ca068 100644
--- a/ui/src/styles/STYLE_README.md
+++ b/ui/src/styles/STYLE_README.md
@@ -244,6 +244,9 @@ CSS 自定义属性同样按变量名排序。嵌套选择器、伪类和媒体
 
 ## 进行中动态点
 
+对话加载动画使用 `app.scss` 的 `mk-conversation-loading`，添加到单个空的 `span` 或 `div`
+即可显示三个依次明暗、缩放的圆点，无需子节点。默认占位为 26px × 18px，颜色使用 N600。
+
 进行中状态文案使用全局 `mk-dotting` 类，通过 `::after` 生成循环变化的省略号。类名直接放在
 文案元素上，不额外添加仅用于点号的空节点；伪元素预留固定宽度，避免动画过程中正文位置抖动。
 
diff --git a/ui/src/styles/app.scss b/ui/src/styles/app.scss
index c8f13f158bc..58f7c564686 100644
--- a/ui/src/styles/app.scss
+++ b/ui/src/styles/app.scss
@@ -144,6 +144,59 @@ h6 {
 }
 
 /* dot */
+// 对话加载圆点，单个空元素即可使用
+.mk-conversation-loading {
+  display: inline-block;
+  flex-shrink: 0;
+  height: 18px;
+  position: relative;
+  vertical-align: middle;
+  width: 26px;
+
+  &::before {
+    animation: mk-conversation-loading 1.4s infinite both;
+    border-radius: 50%;
+    content: '';
+    height: 6px;
+    left: -10px;
+    position: absolute;
+    top: 6px;
+    width: 6px;
+  }
+}
+
+@keyframes mk-conversation-loading {
+  0%,
+  80%,
+  100% {
+    box-shadow:
+      10px 0 0 -0.6px rgb(var(--mk-N600-rgb) / 30%),
+      20px 0 0 -0.6px rgb(var(--mk-N600-rgb) / 30%),
+      30px 0 0 -0.6px rgb(var(--mk-N600-rgb) / 30%);
+  }
+
+  20% {
+    box-shadow:
+      10px 0 0 var(--mk-N600),
+      20px 0 0 -0.6px rgb(var(--mk-N600-rgb) / 30%),
+      30px 0 0 -0.6px rgb(var(--mk-N600-rgb) / 30%);
+  }
+
+  40% {
+    box-shadow:
+      10px 0 0 -0.6px rgb(var(--mk-N600-rgb) / 30%),
+      20px 0 0 var(--mk-N600),
+      30px 0 0 -0.6px rgb(var(--mk-N600-rgb) / 30%);
+  }
+
+  60% {
+    box-shadow:
+      10px 0 0 -0.6px rgb(var(--mk-N600-rgb) / 30%),
+      20px 0 0 -0.6px rgb(var(--mk-N600-rgb) / 30%),
+      30px 0 0 var(--mk-N600);
+  }
+}
+
 // 状态圆点
 .mk-dot-danger {
   border-radius: 50%;
diff --git a/ui/src/views/VIEW_README.md b/ui/src/views/VIEW_README.md
index f417634a517..a2a52db3119 100644
--- a/ui/src/views/VIEW_README.md
+++ b/ui/src/views/VIEW_README.md
@@ -393,6 +393,8 @@ View 负责路由、资源与模式、图加载、保存／发布／调试编排
   对话次数、对话用户、最近对话时间使用 `order_by` 表头排序，用户列映射为 `username`；切换时清空选择并回到第一页，筛选、分页和导出保留排序。
   清除策略通过当前范围 ChatLog API 保存、使用弹窗自身 loading；添加知识库固定所选对话 ID，选项使用当前范围 Knowledge／Document API。
   `ChatLogDetailDrawer` 使用现有 `LogConversation` 展示只读历史对话与执行详情，正文查询仍使用 Workspace API；上一条／下一条与跨页由页面管理。
+  抽屉通过 `content-class` 提供全高内容区，消息列表内部滚动；切换日志时以日志 ID 重建
+  `LogConversation`，隔离分页状态和未结束的请求，重置阅读位置与执行详情。
 - 外部检索页从 context 读取四范围 ExternalRetrieval API；Workspace 共享只读，禁用开关并阻止提交。
   查询失败展示重新加载入口，不展示默认开关；保存期间使用 loading 与 inert，失败保留已保存配置。
   知识库或资源范围变化时重新查询；示例与地址来自响应，只读展示／复制，不在前端拼接。
diff --git a/ui/src/views/application-detail/chat-log/ChatLogDetailDrawer.vue b/ui/src/views/application-detail/chat-log/ChatLogDetailDrawer.vue
index dd0ed2668d9..02398f3e177 100644
--- a/ui/src/views/application-detail/chat-log/ChatLogDetailDrawer.vue
+++ b/ui/src/views/application-detail/chat-log/ChatLogDetailDrawer.vue
@@ -39,13 +39,13 @@ defineExpose({ open, close })
 </script>
 
 <template>
-  <MkDrawer v-model="visible" size="840" @close="close" @closed="emit('closed')">
+  <MkDrawer v-model="visible" size="840" content-class="h-full min-h-0 flex-column" @close="close" @closed="emit('closed')">
     <template #header>
       <h4 class="min-w-0 truncate" :title="props.chatLog.abstract">{{ props.chatLog.abstract || '对话详情' }}</h4>
     </template>
-    <div v-loading="props.loading">
+    <div v-loading="props.loading" class="min-h-0 flex-1">
       <!-- 只读会话面板:展示该日志的历史对话与执行详情,无输入框 -->
-      <LogConversation :chat-id="props.chatLog.id" :application-id="applicationId" :chat-log-api="resourceApi.chatLog" />
+      <LogConversation :key="props.chatLog.id" :chat-id="props.chatLog.id" :application-id="applicationId" :chat-log-api="resourceApi.chatLog" />
     </div>
     <template #footer>
       <!-- 浏览上一个对话日志 -->