feat: 调整了目录结构

src/pages/ChatMain/ChatLongAnswer/index.vue

@@ -0,0 +1,195 @@
+<template>
+  <view class="flex flex-col bg-liner h-screen overflow-hidden">
+    <!-- ✅ 顶部固定导航 -->
+    <view class="flex-shrink-0">
+      <TopNavBar :title="title" background="transparent" />
+    </view>
+
+    <!-- ✅ 滚动区域 -->
+    <scroll-view class="flex-full overflow-hidden chat-scroll" scroll-y :scroll-into-view="scrollIntoViewId" scroll-with-animation @scroll="onScroll" @touchstart="onTouchStart" @touchend="onTouchEnd" @touchcancel="onTouchEnd">
+      <view class="pt-12 px-12 pb-24 border-box">
+         <!-- ✅ 内容，支持markdown -->
+        <ChatMarkdown :text="answerText" />
+
+        <!-- ✅ 底部锚点（必须存在） -->
+        <view id="bottom-anchor"></view>
+      </view>
+    </scroll-view>
+  </view>
+</template>
+
+<script setup>
+import TopNavBar from "@/components/TopNavBar/index.vue";
+import ChatMarkdown from "../ChatMarkdown/index.vue";
+import { defineProps, ref, nextTick } from "vue";
+import { onLoad, onUnload } from "@dcloudio/uni-app";
+import StreamManager from "@/utils/StreamManager.js";
+
+const props = defineProps({
+  answerText: {
+    type: String,
+    default: "",
+  },
+});
+
+const answerText = ref(props.answerText || "");
+const title = ref("");
+
+let unsubscribe = null;
+
+/** ✅ scroll-into-view 控制 */
+const scrollIntoViewId = ref("");
+
+/** 滚动控制状态 */
+const isNearBottom = ref(true);
+const scrollViewHeight = ref(0);
+const SCROLL_THRESHOLD = 150; // px
+
+/** 用户交互状态，用户滚动/触摸时临时禁用自动滚动 */
+const userInteracting = ref(false);
+let interactionTimer = null;
+
+/** 是否已完成（从 URL 参数判断），完成状态下不初始初自动滚到底部 */
+let isFinishedOnInit = false;
+
+/** ✅ 防抖 */
+let scrollTimer = null;
+
+const measureScrollViewHeight = () => {
+  try {
+    // 使用 uni.createSelectorQuery 获取 scroll-view 的准确高度
+    uni.createSelectorQuery()
+      .select(".chat-scroll")
+      .boundingClientRect((rect) => {
+        if (rect && rect.height) {
+          scrollViewHeight.value = rect.height;
+        }
+      })
+      .exec();
+  } catch (e) { }
+}
+
+/** 生成展示用标题：去除前导 `#` 并截取前 6 字符（超过加省略号） */
+const computeTitle = (text = "") => {
+  const t = (text || "").replace(/^#+\s*/, "");
+  return t.length > 8 ? t.substring(0, 8) + "..." : t;
+}
+
+const onScroll = (e) => {
+  try {
+    const { scrollTop = 0, scrollHeight = 0 } = e.detail || {};
+    
+    // 计算距离底部的距离（使用准确的 scroll-view 高度）
+    const viewHeight = scrollViewHeight.value;
+    const distanceToBottom = scrollHeight - scrollTop - viewHeight;
+    
+    // 判断是否在底部附近（允许 SCROLL_THRESHOLD 的误差范围）
+    // 注意：只更新 isNearBottom，不在滚动时强制改变 userInteracting
+    const atBottom = distanceToBottom <= SCROLL_THRESHOLD;
+    isNearBottom.value = atBottom;
+  } catch (e) { }
+}
+
+const onTouchStart = () => {
+  // 触摸开始时，立即标记为用户交互状态
+  userInteracting.value = true;
+  clearTimeout(interactionTimer);
+}
+
+const onTouchEnd = () => {
+  // 触摸结束后延迟一段时间再取消交互状态
+  // 这样即使用户快速滚动，也不会被中途打断
+  clearTimeout(interactionTimer);
+  interactionTimer = setTimeout(() => {
+    userInteracting.value = false;
+  }, 600);
+}
+
+const scrollToBottom = () => {
+  if (scrollTimer) return;
+  if (isFinishedOnInit) return;
+
+  scrollTimer = setTimeout(() => {
+    // ❗关键：强制触发滚动（小程序必须这样）
+    // 如果用户正在交互，则跳过本次自动滚动
+    if (userInteracting.value) {
+      scrollTimer = null;
+      return;
+    }
+
+    scrollIntoViewId.value = "";
+
+    nextTick(() => {
+      // 再次 nextTick + 延迟，兼容 markdown 渲染延迟
+      setTimeout(() => {
+        scrollIntoViewId.value = "bottom-anchor";
+        // 测量高度以便后续滚动判断准确
+        measureScrollViewHeight();
+      }, 50);
+    });
+
+    scrollTimer = null;
+  }, 100);
+}
+
+onLoad(({ message = "", streamId = "", finished = "0" }) => {
+  // 记录初始完成状态
+  isFinishedOnInit = finished === "1";
+
+  console.log("LongAnswer onLoad with params:", { message, streamId, finished });
+
+  // 初次测量 scroll-view 高度
+  nextTick(() => {
+    measureScrollViewHeight();
+  });
+
+  if (streamId) {
+    // ✅ 流式数据
+    unsubscribe = StreamManager.subscribe(
+      streamId,
+      (text = "", finished = false) => {
+        answerText.value = text || "";
+        title.value = computeTitle(answerText.value);
+
+        nextTick(() => {
+          // 每次接收数据都重新测量高度（content size 可能变化，比如加载图）
+          measureScrollViewHeight();
+          
+          // 流式完成时强制滚动到底部
+          if (finished) {
+            scrollToBottom();
+          } 
+          // 流式中的数据更新：只有在用户未交互且接近底部时才自动滚动
+          else if (!userInteracting.value && isNearBottom.value) {
+            scrollToBottom();
+          }
+        });
+      }
+    );
+  } else {
+    // ✅ 非流式
+    answerText.value = decodeURIComponent(message || "");
+    title.value = computeTitle(answerText.value);
+
+    nextTick(() => {
+      // 只有在初始化为非完成状态时才自动滚到底部
+      scrollToBottom();
+    });
+  }
+});
+
+onUnload(() => {
+  try {
+    unsubscribe && unsubscribe();
+  } catch (e) { }
+  // 清理定时器，避免内存泄漏
+  try { clearTimeout(scrollTimer); } catch (e) { }
+  try { clearTimeout(interactionTimer); } catch (e) { }
+  scrollTimer = null;
+  interactionTimer = null;
+});
+</script>
+
+<style scoped>
+
+</style>