Uniapp/lucky_shop
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 1 Wiki Activity

feat(ai-chat): 在流式回答中添加"思考中..."指示，优化操作栏显示逻辑

Browse Source
This commit is contained in:
ZF Sun
2026-09-28 10:05:52 +08:00
parent 306f2f7ff7
commit 0799e47233
1 changed files with 71 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

72
pages_tool/ai-chat/ai-chat-message.vue
View File

@@ -198,6 +198,25 @@
<!-- #endif -->
</view>
</view>
<!-- PR-AI-STREAMING-TAIL (2026-09-28): AI 流式回答中, 在已显示内容下方追加 "思考中..." 指示
仅当消息处于 streaming 状态且非 loading 占位时显示;
流式结束 (isStreaming=false) 时自动消失, 与 .ai-actions 操作栏互补呈现 -->
<view
v-if="message.isStreaming && (message.type === 'text' || message.type === 'markdown')"
class="streaming-tail">
<view class="typing-dots-inline">
<text class="dot"></text>
<text class="dot"></text>
<text class="dot"></text>
</view>
<text class="streaming-tail-text">{{ $lang('ai-chat.index.aiThinking') || '思考中' }}</text>
<text class="streaming-tail-ellipsis">
<text class="ellipsis-dot">.</text>
<text class="ellipsis-dot">.</text>
<text class="ellipsis-dot">.</text>
</text>
</view>
<!-- 文件链接 -->
<view v-else-if="message.type === 'file'" class="file-content">
@@ -362,7 +381,8 @@
<!-- AI 消息下方操作栏: 复制 / 点赞 / 不喜欢 / 更多 -->
<!-- PR-CHAT-UI-CONFIG (2026-09-20): 后端可关闭 ui_enable_feedback (隐藏点赞/点踩/更多), 默认 true -->
<view class="ai-actions" v-if="message.role === 'ai' && message.type !== 'loading' && chatUiConfig.ui_enable_feedback">
<!-- PR-AI-ACTIONS-AFTER-DONE (2026-09-28): 仅在 AI 完全回答完成后才显示操作栏 (排除流式中), 避免一边打字一边出现复制/点赞按钮的"半成品"感 -->
<view class="ai-actions" v-if="message.role === 'ai' && message.type !== 'loading' && !message.isStreaming && chatUiConfig.ui_enable_feedback">
<view class="ai-action-btn" @click="onAiActionCopy(message)">
<text class="iconfont icon-copy">⎘</text>
</view>
@@ -4690,6 +4710,56 @@ _handleStreamError(msg) {
display: none;
}
// PR-AI-STREAMING-TAIL (2026-09-28): AI 流式回答中追加在内容末尾的"思考中..."指示
// 与 .ai-actions 互补: streaming 时只显示 tail, 操作栏等流式结束才显示
.streaming-tail {
display: flex;
align-items: center;
margin-top: 12rpx;
padding-top: 4rpx;
color: $color-primary;
font-size: 24rpx;
font-weight: 500;
line-height: 1;
.typing-dots-inline {
display: inline-flex;
align-items: center;
margin-right: 10rpx;
.dot {
width: 12rpx;
height: 12rpx;
border-radius: 50%;
background-color: $color-primary;
margin: 0 4rpx;
animation: dotPulse 1.5s infinite ease-in-out;
&:nth-child(2) { animation-delay: 0.2s; }
&:nth-child(3) { animation-delay: 0.4s; }
}
}
.streaming-tail-text {
color: $color-primary;
font-weight: 500;
}
.streaming-tail-ellipsis {
display: inline-flex;
margin-left: 4rpx;
.ellipsis-dot {
animation: ellipsisBlink 1.4s infinite ease-in-out;
opacity: 0;
&:nth-child(1) { animation-delay: 0s; }
&:nth-child(2) { animation-delay: 0.2s; }
&:nth-child(3) { animation-delay: 0.4s; }
}
}
}
/* AI 消息下方操作栏: 复制 / 点赞 / 不喜欢 / 朗读 / 更多 */
.ai-actions {
margin-top: 12rpx;