聊天室滚动修正

urbanLifelineWeb/packages/workcase/src/views/public/ChatRoom/chatRoom/ChatRoom.vue

@@ -281,7 +281,31 @@ const handleFileSelect = (e: Event) => {
 const scrollToBottom = () => {
     nextTick(() => {
         if (messagesRef.value) {
-            messagesRef.value.scrollTop = messagesRef.value.scrollHeight
+            // 使用 smooth 滚动到底部
+            messagesRef.value.scrollTo({
+                top: messagesRef.value.scrollHeight,
+                behavior: 'instant'
+            })
+
+            // 延迟再次确保滚动到底部（处理内容动态渲染的情况）
+            setTimeout(() => {
+                if (messagesRef.value) {
+                    messagesRef.value.scrollTo({
+                        top: messagesRef.value.scrollHeight,
+                        behavior: 'instant'
+                    })
+                }
+            }, 100)
+
+            // 最后一次确保（处理图片等异步内容加载）
+            setTimeout(() => {
+                if (messagesRef.value) {
+                    messagesRef.value.scrollTo({
+                        top: messagesRef.value.scrollHeight,
+                        behavior: 'instant'
+                    })
+                }
+            }, 300)
         }
     })
 }

urbanLifelineWeb/packages/workcase_wechat/pages/chatRoom/chatRoom/chatRoom.uvue

@@ -42,7 +42,8 @@
 			</view>
 		</view>
 		<!-- 聊天消息区域 -->
-		<scroll-view class="chat-area" scroll-y="true" :scroll-top="scrollTop" 
+		<scroll-view class="chat-area" scroll-y="true" :scroll-top="scrollTop"
+			:scroll-with-animation="false"
 			:style="{ top: (headerPaddingTop + 88) + 'px' }"
 			@scrolltoupper="loadMoreMessages"
 			upper-threshold="50">
@@ -374,15 +375,20 @@ async function loadMessages() {
 			const actualTotalPages = pageInfo?.totalPages || 1
 			hasMore.value = actualTotalPages > currentPage.value
 			console.log('[loadMessages] pageInfo:', pageInfo, 'actualTotalPages:', actualTotalPages, 'hasMore:', hasMore.value)
-			
+
 			// 后端降序返回，需要反转后显示（早的在上，新的在下）
 			const reversedList = [...msgRes.dataList].reverse()
 			messages.splice(0, messages.length, ...reversedList)
 			console.log('[loadMessages] 加载完成, 消息数:', messages.length)
-			
+
-			// 加载完第一页后检查是否需要自动填充
+			// 加载完第一页后滚动到底部，需要等待 DOM 完全渲染
 			if (currentPage.value === 1) {
-				nextTick(() => scrollToBottom())
+				// 使用 setTimeout 确保 DOM 完全渲染后再滚动
+				nextTick(() => {
+					setTimeout(() => {
+						scrollToBottom()
+					}, 300)
+				})
 			} else {
 				nextTick(() => scrollToBottom())
 			}
@@ -552,7 +558,14 @@ async function sendMessage() {
 
 // 滚动到底部
 function scrollToBottom() {
-	scrollTop.value = 999999
+	// uni-app 的 scroll-view 需要 scroll-top 值发生变化才会触发滚动
+	// 先重置为 0
+	scrollTop.value = 0
+	// 使用 setTimeout 确保重置生效
+	setTimeout(() => {
+		// 使用一个足够大的值确保滚动到底部
+		scrollTop.value = 999999
+	}, 50)
 }
 
 // 处理工单操作