优化加载信息,优化气泡字体大小

This commit is contained in:
2026-08-06 16:55:37 +08:00
parent 23a03d0ed3
commit 6bb7f37276
3 changed files with 178 additions and 70 deletions

View File

@@ -121,8 +121,8 @@
</view>
<view class="main-chat">
<scroll-view class="chat-messages" direction="vertical" scroll-y :scroll-into-view="scrollToView"
:upper-threshold="50" :scroll-with-animation="!isThinking" @scroll="onScroll" @scrolltoupper="onScrollToUpper">
<scroll-view class="chat-messages" direction="vertical" scroll-y :scroll-into-view="scrollToView"
:upper-threshold="50" :scroll-with-animation="scrollAnimationEnabled && !isThinking" @scroll="onScroll" @scrolltoupper="onScrollToUpper">
<!-- 加载更多提示 -->
<view v-if="(ChatType === 0 && isAILoadingMore) || (ChatType === 1 && isFriendLoadingMore) || (ChatType === 2 && isGroupLoadingMore)" class="load-more-tip">
<text>加载更多消息...</text>
@@ -1687,13 +1687,14 @@ import { openFile as openFileNative, downloadAndOpen } from '@/utils/fileOpener.
const scrollToView = ref('')
const bottomToggle = ref(false)
const scrollAnimationEnabled = ref(true) // 控制 scroll-with-animation加载更多时关闭避免可见滑动
// 加载状态和分页相关变量
const isLoadingMore = ref(false) // 是否正在加载更多
const isAILoadingMore = ref(false) // AI 会话是否正在加载更多(滚动到顶部触发)
const aiPageNumber = ref(0) // AI 会话当前服务端页码0-based
const hasMoreAIMessages = ref(true) // AI 会话是否还有更多消息可加载
const currentPage = ref(1) // 当前页码(如果后端支持分页)
const pageSize = 200;
const pageSize = 20;
// 好友消息分页
const isFriendLoadingMore = ref(false) // 好友会话是否正在加载更多
@@ -1819,7 +1820,10 @@ import { openFile as openFileNative, downloadAndOpen } from '@/utils/fileOpener.
// 定位滚动原本第一条消息old index 0现在在 index = olderMessages.length 处
await nextTick()
scrollAnimationEnabled.value = false // 关闭动画,无感定位
scrollToView.value = 'msg-' + olderMessages.length
await nextTick()
scrollAnimationEnabled.value = true
} else {
// 只有 API 返回空时才确认没有更多
hasMoreAIMessages.value = false
@@ -1845,7 +1849,10 @@ import { openFile as openFileNative, downloadAndOpen } from '@/utils/fileOpener.
allmessages.value = [...olderMessages, ...allmessages.value]
// 定位滚动
await nextTick()
scrollAnimationEnabled.value = false
scrollToView.value = 'msg-' + olderMessages.length
await nextTick()
scrollAnimationEnabled.value = true
} else {
hasMoreFriendMessages.value = false
}
@@ -1870,7 +1877,10 @@ import { openFile as openFileNative, downloadAndOpen } from '@/utils/fileOpener.
allmessages.value = [...olderMessages, ...allmessages.value]
// 定位滚动
await nextTick()
scrollAnimationEnabled.value = false
scrollToView.value = 'msg-' + olderMessages.length
await nextTick()
scrollAnimationEnabled.value = true
} else {
hasMoreGroupMessages.value = false
}
@@ -2032,67 +2042,143 @@ import { openFile as openFileNative, downloadAndOpen } from '@/utils/fileOpener.
<!-- v-html 渲染的 markdown 内容无法被 scoped 样式命中需非 scoped 样式块 -->
<style lang="scss">
// /* 气泡内容字体:确保 v-html 渲染的 markdown 内容使用系统字体栈 */
// .chat-content {
// // font-family: -apple-system, BlinkMacSystemFont, 'PingFang SC', 'HarmonyOS Sans', 'MiSans',
// // 'Source Han Sans CN', 'Microsoft YaHei', 'Noto Sans CJK SC', sans-serif;
// // font-weight: 400;
// font-family: -apple-system, BlinkMacSystemFont, 'PingFang SC', 'HarmonyOS Sans', 'MiSans',
// 'Source Han Sans CN', 'Microsoft YaHei', 'Noto Sans CJK SC', sans-serif !important;
// font-size: 16px !important;
// font-weight: 600 !important;
// line-height: 1.6;
// margin: 8rpx 0;
// h1 {
// font-size: 42rpx;
// line-height: 1.4;
// margin: 16rpx 0 10rpx;
// }
// h2 {
// font-size: 38rpx;
// line-height: 1.4;
// margin: 14rpx 0 8rpx;
// }
// h3 {
// font-size: 36rpx;
// line-height: 1.4;
// margin: 12rpx 0 8rpx;
// }
// h4,
// h5,
// h6 {
// font-size: 34rpx;
// line-height: 1.5;
// margin: 10rpx 0 6rpx;
// }
// /* 普通正文 */
// p,
// text,
// span {
// font-family: -apple-system, BlinkMacSystemFont, 'PingFang SC', 'HarmonyOS Sans', 'MiSans',
// 'Source Han Sans CN', 'Microsoft YaHei', 'Noto Sans CJK SC', sans-serif !important;
// font-size: 38rpx !important;
// font-weight: 400 !important;
// line-height: 1.6;
// margin: 8rpx 0;
// }
// /* 粗体和斜体样式 */
// strong,
// b {
// font-weight: 600 !important;
// }
// em,
// i {
// font-style: italic !important;
// }
/* 气泡内容字体:确保 v-html 渲染的 markdown 内容使用系统字体栈 */
.chat-content {
// font-family: -apple-system, BlinkMacSystemFont, 'PingFang SC', 'HarmonyOS Sans', 'MiSans',
// 'Source Han Sans CN', 'Microsoft YaHei', 'Noto Sans CJK SC', sans-serif;
// font-weight: 400;
font-family: -apple-system, BlinkMacSystemFont, 'PingFang SC', 'HarmonyOS Sans', 'MiSans',
'Source Han Sans CN', 'Microsoft YaHei', 'Noto Sans CJK SC', sans-serif !important;
font-size: 16px !important;
font-weight: 600 !important;
line-height: 1.6;
margin: 8rpx 0;
font-size: 30rpx !important;
line-height: 48rpx !important;
margin: 8rpx 0 !important;
h1 {
font-size: 42rpx;
line-height: 1.4;
margin: 16rpx 0 10rpx;
font-size: 34rpx !important;
font-weight: 600 !important;
line-height: 56rpx !important;
margin: 22rpx 0 14rpx !important;
}
h2 {
font-size: 38rpx;
line-height: 1.4;
margin: 14rpx 0 8rpx;
font-size: 32rpx !important;
font-weight: 600 !important;
line-height: 52rpx !important;
margin: 18rpx 0 10rpx !important;
}
h3 {
font-size: 36rpx;
line-height: 1.4;
margin: 12rpx 0 8rpx;
font-size: 30rpx !important;
font-weight: 600 !important;
line-height: 48rpx !important;
margin: 14rpx 0 6rpx !important;
}
h4,
h5,
h4 {
font-size: 28rpx !important;
font-weight: 600 !important;
line-height: 48rpx !important;
margin: 14rpx 0 6rpx !important;
}
h5 {
font-size: 26rpx !important;
font-weight: 600 !important;
line-height: 44rpx !important;
margin: 10rpx 0 4rpx !important;
}
h6 {
font-size: 34rpx;
line-height: 1.5;
margin: 10rpx 0 6rpx;
font-size: 24rpx !important;
font-weight: 600 !important;
line-height: 40rpx !important;
margin: 10rpx 0 4rpx !important;
}
/* 普通正文 */
p,
text,
span {
font-family: -apple-system, BlinkMacSystemFont, 'PingFang SC', 'HarmonyOS Sans', 'MiSans',
'Source Han Sans CN', 'Microsoft YaHei', 'Noto Sans CJK SC', sans-serif !important;
font-size: 38rpx !important;
font-weight: 400 !important;
line-height: 1.6;
margin: 8rpx 0;
font-size: 30rpx !important;
line-height: 48rpx !important;
margin: 8rpx 0 !important;
}
/* 粗体和斜体样式 */
strong,
b {
font-weight: 600 !important;
}
em,
i {
font-style: italic !important;
}
/* 气泡内的内联链接(替代 <a> 标签,点击由 JS 拦截处理) */
.chat-inline-link {