YiLin/phone-app------test1-
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

添加加载，优化气泡弹窗

Browse Source
This commit is contained in:
YiLin
2026-07-25 18:10:16 +08:00
parent 48452cec2e
commit f240176563
4 changed files with 194 additions and 66 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
components/ChatSidebar.vue
View File

@@ -163,7 +163,8 @@
'update:showNewChatModal', 'update:showNewChatModal',
'update:currentSessionId', 'update:currentSessionId',
'refresh-conversations', 'refresh-conversations',
'update:chatType' 'update:chatType',
'select-chat'
]) ])
const UserConversations = toRef(props, 'chatList') const UserConversations = toRef(props, 'chatList')
@@ -262,6 +263,7 @@
} }
uni.setStorageSync('currentSessionId', chatId) uni.setStorageSync('currentSessionId', chatId)
emit('update:currentSessionId', chatId) emit('update:currentSessionId', chatId)
emit('select-chat')
} }

81
pages/Chat/Chat.vue
View File

@@ -41,7 +41,8 @@
<view class="chat-sidebar" :class="{'sidebar-show' : isChatSidebar}"> <view class="chat-sidebar" :class="{'sidebar-show' : isChatSidebar}">
<ChatSidebar :chatList="UserConversations" v-model:showNewChatModal="showNewChatModal" <ChatSidebar :chatList="UserConversations" v-model:showNewChatModal="showNewChatModal"
v-model:currentSessionId="currentSessionId" v-model:chatType="ChatType" v-model:currentSessionId="currentSessionId" v-model:chatType="ChatType"
@refresh-conversations="takeUserConversations"> @refresh-conversations="takeUserConversations"
@select-chat="isChatSidebar = false">
</ChatSidebar> </ChatSidebar>
</view> </view>
@@ -67,6 +68,17 @@
<view class="main-chat"> <view class="main-chat">
<scroll-view class="chat-messages" direction="vertical" scroll-y :scroll-into-view="scrollToView" <scroll-view class="chat-messages" direction="vertical" scroll-y :scroll-into-view="scrollToView"
:upper-threshold="0" :scroll-with-animation="true" @scroll="onScroll"> :upper-threshold="0" :scroll-with-animation="true" @scroll="onScroll">
<!-- 消息加载中弹窗（仅会话变化时显示） -->
<view v-if="isLoadingMessages" class="messages-loading-overlay">
<view class="messages-loading-card">
<view class="bubble-loading-dots">
<view class="bubble-dot"></view>
<view class="bubble-dot"></view>
<view class="bubble-dot"></view>
</view>
<text class="messages-loading-text">加载中...</text>
</view>
</view>
<!-- 与AI的对话内容展示 --> <!-- 与AI的对话内容展示 -->
<template v-for="(message, index) in currentMessages" :key="index"> <template v-for="(message, index) in currentMessages" :key="index">
<view v-if="ChatType === 0 && message.role !== 'tool'" class="chat-message" :id="'msg-' + index" <view v-if="ChatType === 0 && message.role !== 'tool'" class="chat-message" :id="'msg-' + index"
@@ -718,12 +730,14 @@
const isThinking = ref(false) const isThinking = ref(false)
const isSelfSent = ref(false) // 是否当前设备发起的 AI 对话（用于区分弹窗/仅锁输入） const isSelfSent = ref(false) // 是否当前设备发起的 AI 对话（用于区分弹窗/仅锁输入）
const isUploading = ref(false) const isUploading = ref(false)
const isLoadingMessages = ref(false) // 消息加载中状态（仅会话变化时显示）
const uploadedFiles = ref([]) const uploadedFiles = ref([])
const streamingMessageId = ref(null) // 流式消息的临时 ID，用于实时更新 AI 回复 const streamingMessageId = ref(null) // 流式消息的临时 ID，用于实时更新 AI 回复
// 消息详情弹窗 // 消息详情弹窗
const showMessageModal = ref(false) const showMessageModal = ref(false)
const detailLinks = ref([]) const detailLinks = ref([])
// 点击气泡内容：拦截链接点击，否则 AI 对话弹出详情 // 点击气泡内容：拦截链接点击，否则 AI 对话弹出详情
const handleChatContentClick = (e, message) => { const handleChatContentClick = (e, message) => {
// 在事件路径中向上查找 .chat-inline-link 元素 // 在事件路径中向上查找 .chat-inline-link 元素
@@ -738,8 +752,17 @@
} }
el = el.parentElement el = el.parentElement
} }
// 非链接点击：仅 AI 对话弹出详情窗
if (message.role) { // 检查消息内容是否包含链接
const hasLink = message.content && (
message.content.includes('http://') ||
message.content.includes('https://') ||
/<a\s+[^>]*href\s*=\s*['"][^'"]*['"]/i.test(message.content) ||
/\[[^\]]*\]\([^)]*\)/i.test(message.content) // 匹配 Markdown 链接格式
)
// 只有包含链接时才弹出详情窗
if (message.role && hasLink) {
showMessageDetail(message) showMessageDetail(message)
} }
} }
@@ -1347,6 +1370,8 @@
title: `获取ai会话内容失败${error}`, title: `获取ai会话内容失败${error}`,
icon: 'none' icon: 'none'
}) })
} finally {
isLoadingMessages.value = false
} }
} }
const takeFriendMessages = async () => { const takeFriendMessages = async () => {
@@ -1360,6 +1385,8 @@
title: `获取好友会话消息失败${error}`, title: `获取好友会话消息失败${error}`,
icon: 'none' icon: 'none'
}) })
} finally {
isLoadingMessages.value = false
} }
} }
const takeGroupMessages = async () => { const takeGroupMessages = async () => {
@@ -1382,6 +1409,8 @@
title: `获取群聊会话失败${error}`, title: `获取群聊会话失败${error}`,
icon: 'none' icon: 'none'
}) })
} finally {
isLoadingMessages.value = false
} }
} }
// // 加载更多消息 // // 加载更多消息
@@ -1443,9 +1472,14 @@
immediate: true immediate: true
}) })
watch(currentSessionId, (newId) => { watch(currentSessionId, async (newId, oldId) => {
if (newId) { if (newId) {
uni.setStorageSync('currentSessionId', currentSessionId.value) uni.setStorageSync('currentSessionId', currentSessionId.value)
// 会话变化时显示加载弹窗并清空消息
if (oldId && oldId !== newId) {
isLoadingMessages.value = true
allmessages.value = []
}
switch (ChatType.value) { switch (ChatType.value) {
case 0: case 0:
takeConversationMessages(); takeConversationMessages();
@@ -1454,10 +1488,10 @@
handleConnect() handleConnect()
break; break;
case 1: case 1:
takeFriendMessages(); await takeFriendMessages();
break; break;
case 2: case 2:
takeGroupMessages(); await takeGroupMessages();
break; break;
default: default:
takeConversationMessages(); takeConversationMessages();
@@ -1488,6 +1522,7 @@
await takeUserConversations(); await takeUserConversations();
// 只有在会话ID存在时才获取消息 // 只有在会话ID存在时才获取消息
if (currentSessionId.value) { if (currentSessionId.value) {
isLoadingMessages.value = true
takeConversationMessages(); takeConversationMessages();
} }
// AI 对话页面：主动建立 socket 连接，确保消息实时推送 // AI 对话页面：主动建立 socket 连接，确保消息实时推送
@@ -1496,11 +1531,13 @@
} }
} else if (chatType === 1) { } else if (chatType === 1) {
await takeFriendList() await takeFriendList()
takeFriendMessages(); isLoadingMessages.value = true
await takeFriendMessages();
handleFriendConnect() handleFriendConnect()
} else if (chatType === 2) { } else if (chatType === 2) {
await takeGroupList() await takeGroupList()
await handleFriendConnect() await handleFriendConnect()
isLoadingMessages.value = true
await takeGroupMessages() await takeGroupMessages()
} }
}) })
@@ -1626,6 +1663,36 @@
} }
} }
/* 消息加载中弹窗（仅会话变化时显示） */
.messages-loading-overlay {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
display: flex;
justify-content: center;
align-items: center;
background: rgba(255, 255, 255, 0.9);
z-index: 100;
}
.messages-loading-card {
display: flex;
flex-direction: column;
align-items: center;
padding: 40rpx 60rpx;
background: #ffffff;
border-radius: 24rpx;
box-shadow: 0 8rpx 32rpx rgba(0, 0, 0, 0.12);
}
.messages-loading-text {
margin-top: 20rpx;
font-size: 28rpx;
color: #999;
}
/* 消息详情弹窗 — 链接提取区域 */ /* 消息详情弹窗 — 链接提取区域 */
.detail-links-section { .detail-links-section {
margin-top: 24rpx; margin-top: 24rpx;

147
unpackage/dist/dev/app-plus/app-service.js vendored
View File

@@ -2532,7 +2532,8 @@ if (uni.restoreGlobal) {
"update:showNewChatModal", "update:showNewChatModal",
"update:currentSessionId", "update:currentSessionId",
"refresh-conversations", "refresh-conversations",
"update:chatType" "update:chatType",
"select-chat"
], ],
setup(__props, { expose: __expose, emit: __emit }) { setup(__props, { expose: __expose, emit: __emit }) {
__expose(); __expose();
@@ -2569,7 +2570,7 @@ if (uni.restoreGlobal) {
isSelectMode.value = false; isSelectMode.value = false;
emit("refresh-conversations"); emit("refresh-conversations");
} catch (error) { } catch (error) {
formatAppLog("error", "at components/ChatSidebar.vue:209", "删除会话失败：", error); formatAppLog("error", "at components/ChatSidebar.vue:210", "删除会话失败：", error);
uni.showToast({ uni.showToast({
title: "删除失败，请重试", title: "删除失败，请重试",
icon: "none" icon: "none"
@@ -2598,7 +2599,7 @@ if (uni.restoreGlobal) {
uni.showToast({ title: "已删除全部对话", icon: "success" }); uni.showToast({ title: "已删除全部对话", icon: "success" });
emit("refresh-conversations"); emit("refresh-conversations");
} catch (error) { } catch (error) {
formatAppLog("error", "at components/ChatSidebar.vue:241", "清空全部对话失败：", error); formatAppLog("error", "at components/ChatSidebar.vue:242", "清空全部对话失败：", error);
uni.showToast({ title: "删除失败，请重试", icon: "none" }); uni.showToast({ title: "删除失败，请重试", icon: "none" });
} }
} }
@@ -2610,15 +2611,16 @@ if (uni.restoreGlobal) {
}); });
const currentChatId = vue.toRef(props, "currentSessionId"); const currentChatId = vue.toRef(props, "currentSessionId");
const selectChat = (chatId, receiverId = "") => { const selectChat = (chatId, receiverId = "") => {
formatAppLog("log", "at components/ChatSidebar.vue:259", "选择的id是：", chatId); formatAppLog("log", "at components/ChatSidebar.vue:260", "选择的id是：", chatId);
if (receiverId) { if (receiverId) {
uni.setStorageSync("receiverId", receiverId); uni.setStorageSync("receiverId", receiverId);
} }
uni.setStorageSync("currentSessionId", chatId); uni.setStorageSync("currentSessionId", chatId);
emit("update:currentSessionId", chatId); emit("update:currentSessionId", chatId);
emit("select-chat");
}; };
const openNewChatModal = () => { const openNewChatModal = () => {
formatAppLog("log", "at components/ChatSidebar.vue:270", "点击了新建会话"); formatAppLog("log", "at components/ChatSidebar.vue:272", "点击了新建会话");
emit("update:showNewChatModal", true); emit("update:showNewChatModal", true);
}; };
const goContactPages = () => { const goContactPages = () => {
@@ -2662,7 +2664,7 @@ if (uni.restoreGlobal) {
const UserInfo = await getUserInfo(UserToken.value); const UserInfo = await getUserInfo(UserToken.value);
UserAvatar.value = UserInfo.avatar || ""; UserAvatar.value = UserInfo.avatar || "";
UserName.value = UserInfo.username || ""; UserName.value = UserInfo.username || "";
formatAppLog("log", "at components/ChatSidebar.vue:326", "菜单收到的会话列表：", UserConversations.value); formatAppLog("log", "at components/ChatSidebar.vue:328", "菜单收到的会话列表：", UserConversations.value);
}); });
const __returned__ = { props, emit, UserConversations, showNewChatModal, chatType, openUserCardVisible, isSelectMode, selectedHistoryIds, deleteConversations, clearAllConversations, isAllHistorySelected, currentChatId, selectChat, openNewChatModal, goContactPages, chatHistoryQuery, isHistorySearchFocused, toggleSelectMode, toggleHistorySelect, toggleSelectAllHistory, UserToken, UserAvatar, UserName, truncateText, computed: vue.computed, onMounted: vue.onMounted, onUnmounted: vue.onUnmounted, ref: vue.ref, toRef: vue.toRef, get deleteConversation() { const __returned__ = { props, emit, UserConversations, showNewChatModal, chatType, openUserCardVisible, isSelectMode, selectedHistoryIds, deleteConversations, clearAllConversations, isAllHistorySelected, currentChatId, selectChat, openNewChatModal, goContactPages, chatHistoryQuery, isHistorySearchFocused, toggleSelectMode, toggleHistorySelect, toggleSelectAllHistory, UserToken, UserAvatar, UserName, truncateText, computed: vue.computed, onMounted: vue.onMounted, onUnmounted: vue.onUnmounted, ref: vue.ref, toRef: vue.toRef, get deleteConversation() {
return deleteConversation; return deleteConversation;
@@ -5637,7 +5639,7 @@ This will fail in production.`);
if (friendSocketStore.isConnected) if (friendSocketStore.isConnected)
return; return;
if (!userToken.value || !UserId.value) { if (!userToken.value || !UserId.value) {
formatAppLog("warn", "at pages/Chat/Chat.vue:334", "Token或UserId未准备好"); formatAppLog("warn", "at pages/Chat/Chat.vue:346", "Token或UserId未准备好");
return; return;
} }
friendSocketStore.connect({ friendSocketStore.connect({
@@ -5723,7 +5725,7 @@ This will fail in production.`);
); );
return html; return html;
} catch (e2) { } catch (e2) {
formatAppLog("error", "at pages/Chat/Chat.vue:460", "解析失败", e2); formatAppLog("error", "at pages/Chat/Chat.vue:472", "解析失败", e2);
return content; return content;
} }
}; };
@@ -5782,7 +5784,7 @@ This will fail in production.`);
files files
}; };
} catch (e2) { } catch (e2) {
formatAppLog("error", "at pages/Chat/Chat.vue:537", "解析文件信息失败:", e2); formatAppLog("error", "at pages/Chat/Chat.vue:549", "解析文件信息失败:", e2);
return { return {
textContent: content, textContent: content,
files: [] files: []
@@ -5819,7 +5821,7 @@ This will fail in production.`);
} }
takeUserConversations(); takeUserConversations();
} catch (error) { } catch (error) {
formatAppLog("error", "at pages/Chat/Chat.vue:582", "新建普通会话失败：", error); formatAppLog("error", "at pages/Chat/Chat.vue:594", "新建普通会话失败：", error);
uni.showToast({ uni.showToast({
title: "创建会话失败，请重试", title: "创建会话失败，请重试",
icon: "none" icon: "none"
@@ -5857,7 +5859,7 @@ This will fail in production.`);
}; };
const previewFileArray = vue.ref([]); const previewFileArray = vue.ref([]);
const uploadPhoto = () => { const uploadPhoto = () => {
formatAppLog("log", "at pages/Chat/Chat.vue:631", "点击了拍照上传"); formatAppLog("log", "at pages/Chat/Chat.vue:643", "点击了拍照上传");
uni.chooseImage({ uni.chooseImage({
count: 1, count: 1,
sourceType: ["camera", "album"], sourceType: ["camera", "album"],
@@ -5880,7 +5882,7 @@ This will fail in production.`);
}); });
}, },
fail: (err) => { fail: (err) => {
formatAppLog("error", "at pages/Chat/Chat.vue:649", "选择图片失败", err); formatAppLog("error", "at pages/Chat/Chat.vue:661", "选择图片失败", err);
} }
}); });
}; };
@@ -5889,12 +5891,12 @@ This will fail in production.`);
}; };
const fileList = vue.ref([]); const fileList = vue.ref([]);
const uploadFile = () => { const uploadFile = () => {
formatAppLog("log", "at pages/Chat/Chat.vue:660", "点击了上传文件"); formatAppLog("log", "at pages/Chat/Chat.vue:672", "点击了上传文件");
chooseFile({ chooseFile({
count: 5, count: 5,
type: "all", type: "all",
success: (res) => { success: (res) => {
formatAppLog("log", "at pages/Chat/Chat.vue:665", "成功了"); formatAppLog("log", "at pages/Chat/Chat.vue:677", "成功了");
fileList.value = res.tempFiles; fileList.value = res.tempFiles;
previewFileArray.value.push(...res.tempFiles); previewFileArray.value.push(...res.tempFiles);
uni.showToast({ uni.showToast({
@@ -5903,7 +5905,7 @@ This will fail in production.`);
}); });
}, },
fail: (err) => { fail: (err) => {
formatAppLog("error", "at pages/Chat/Chat.vue:676", "选择失败:", err); formatAppLog("error", "at pages/Chat/Chat.vue:688", "选择失败:", err);
uni.showToast({ uni.showToast({
title: "选择失败", title: "选择失败",
icon: "error" icon: "error"
@@ -5937,6 +5939,7 @@ This will fail in production.`);
const isThinking = vue.ref(false); const isThinking = vue.ref(false);
const isSelfSent = vue.ref(false); const isSelfSent = vue.ref(false);
const isUploading = vue.ref(false); const isUploading = vue.ref(false);
const isLoadingMessages = vue.ref(false);
const uploadedFiles = vue.ref([]); const uploadedFiles = vue.ref([]);
const streamingMessageId = vue.ref(null); const streamingMessageId = vue.ref(null);
const showMessageModal = vue.ref(false); const showMessageModal = vue.ref(false);
@@ -5953,7 +5956,8 @@ This will fail in production.`);
} }
el = el.parentElement; el = el.parentElement;
} }
if (message.role) { const hasLink = message.content && (message.content.includes("http://") || message.content.includes("https://") || /<a\s+[^>]*href\s*=\s*['"][^'"]*['"]/i.test(message.content) || /\[[^\]]*\]\([^)]*\)/i.test(message.content));
if (message.role && hasLink) {
showMessageDetail(message); showMessageDetail(message);
} }
}; };
@@ -6103,7 +6107,7 @@ This will fail in production.`);
previewFileArray.value = []; previewFileArray.value = [];
} catch (err) { } catch (err) {
uni.hideLoading(); uni.hideLoading();
formatAppLog("error", "at pages/Chat/Chat.vue:900", "文件上传失败:", err); formatAppLog("error", "at pages/Chat/Chat.vue:923", "文件上传失败:", err);
uni.showToast({ uni.showToast({
title: "文件上传失败，请重试", title: "文件上传失败，请重试",
icon: "error" icon: "error"
@@ -6237,15 +6241,15 @@ This will fail in production.`);
} }
}; };
const stopConversation = async () => { const stopConversation = async () => {
formatAppLog("log", "at pages/Chat/Chat.vue:1069", "中断对话 - 当前会话ID:", currentSessionId.value); formatAppLog("log", "at pages/Chat/Chat.vue:1092", "中断对话 - 当前会话ID:", currentSessionId.value);
try { try {
await socketStore.send({ await socketStore.send({
type: "stop", type: "stop",
conversation_id: currentSessionId.value conversation_id: currentSessionId.value
}); });
formatAppLog("log", "at pages/Chat/Chat.vue:1075", "中断指令已发送成功"); formatAppLog("log", "at pages/Chat/Chat.vue:1098", "中断指令已发送成功");
} catch (err) { } catch (err) {
formatAppLog("error", "at pages/Chat/Chat.vue:1077", "中断指令发送失败:", err); formatAppLog("error", "at pages/Chat/Chat.vue:1100", "中断指令发送失败:", err);
} }
if (streamingMessageId.value) { if (streamingMessageId.value) {
allmessages.value = allmessages.value.filter((m) => m._id !== streamingMessageId.value); allmessages.value = allmessages.value.filter((m) => m._id !== streamingMessageId.value);
@@ -6263,9 +6267,9 @@ This will fail in production.`);
}); });
}; };
vue.watch(() => socketStore.isThinking, (newVal, oldVal) => { vue.watch(() => socketStore.isThinking, (newVal, oldVal) => {
formatAppLog("log", "at pages/Chat/Chat.vue:1101", "isThinking 变化:", oldVal, "→", newVal, "messageString:", socketStore.messageString); formatAppLog("log", "at pages/Chat/Chat.vue:1124", "isThinking 变化:", oldVal, "→", newVal, "messageString:", socketStore.messageString);
if (!oldVal && newVal) { if (!oldVal && newVal) {
formatAppLog("log", "at pages/Chat/Chat.vue:1104", "AI开始回复（跨设备同步），锁定输入框"); formatAppLog("log", "at pages/Chat/Chat.vue:1127", "AI开始回复（跨设备同步），锁定输入框");
isThinking.value = true; isThinking.value = true;
if (!streamingMessageId.value) { if (!streamingMessageId.value) {
streamingMessageId.value = "streaming-" + Date.now(); streamingMessageId.value = "streaming-" + Date.now();
@@ -6279,7 +6283,7 @@ This will fail in production.`);
return; return;
} }
if (oldVal && !newVal) { if (oldVal && !newVal) {
formatAppLog("log", "at pages/Chat/Chat.vue:1120", "AI回复结束（正常/中断），解锁并刷新消息列表"); formatAppLog("log", "at pages/Chat/Chat.vue:1143", "AI回复结束（正常/中断），解锁并刷新消息列表");
if (streamingMessageId.value) { if (streamingMessageId.value) {
allmessages.value = allmessages.value.filter((m) => m._id !== streamingMessageId.value); allmessages.value = allmessages.value.filter((m) => m._id !== streamingMessageId.value);
streamingMessageId.value = null; streamingMessageId.value = null;
@@ -6331,15 +6335,15 @@ This will fail in production.`);
UserData.value = await getUserInfo(userToken.value); UserData.value = await getUserInfo(userToken.value);
UserId.value = UserData.value._id; UserId.value = UserData.value._id;
UserAvatar.value = UserData.value.avatar || ""; UserAvatar.value = UserData.value.avatar || "";
formatAppLog("log", "at pages/Chat/Chat.vue:1184", "用户信息已加载:", UserId.value, UserAvatar.value); formatAppLog("log", "at pages/Chat/Chat.vue:1207", "用户信息已加载:", UserId.value, UserAvatar.value);
} catch (error) { } catch (error) {
formatAppLog("error", "at pages/Chat/Chat.vue:1186", "获取用户信息失败:", error); formatAppLog("error", "at pages/Chat/Chat.vue:1209", "获取用户信息失败:", error);
} }
}; };
const takeUserConversations = async () => { const takeUserConversations = async () => {
try { try {
userToken.value = getToken(); userToken.value = getToken();
formatAppLog("log", "at pages/Chat/Chat.vue:1194", "token:", userToken.value); formatAppLog("log", "at pages/Chat/Chat.vue:1217", "token:", userToken.value);
UserConversations.value = await getUserConversations(userToken.value) || []; UserConversations.value = await getUserConversations(userToken.value) || [];
const savedSessionId = getCurrentSessionId(); const savedSessionId = getCurrentSessionId();
if (savedSessionId && UserConversations.value.some((c) => c._id === savedSessionId)) { if (savedSessionId && UserConversations.value.some((c) => c._id === savedSessionId)) {
@@ -6349,7 +6353,7 @@ This will fail in production.`);
} else { } else {
currentSessionId.value = ""; currentSessionId.value = "";
} }
formatAppLog("log", "at pages/Chat/Chat.vue:1206", "保存会话id：", currentSessionId.value); formatAppLog("log", "at pages/Chat/Chat.vue:1229", "保存会话id：", currentSessionId.value);
uni.setStorageSync("currentSessionId", currentSessionId.value); uni.setStorageSync("currentSessionId", currentSessionId.value);
} catch (error) { } catch (error) {
uni.showToast({ uni.showToast({
@@ -6361,17 +6365,17 @@ This will fail in production.`);
const FriendInfoList = vue.ref([]); const FriendInfoList = vue.ref([]);
const takeFriendList = async () => { const takeFriendList = async () => {
try { try {
formatAppLog("log", "at pages/Chat/Chat.vue:1221", "开始获取好友列表"); formatAppLog("log", "at pages/Chat/Chat.vue:1244", "开始获取好友列表");
const friendList = await getChatFriend(UserId.value); const friendList = await getChatFriend(UserId.value);
formatAppLog("log", "at pages/Chat/Chat.vue:1224", "friendList:", friendList); formatAppLog("log", "at pages/Chat/Chat.vue:1247", "friendList:", friendList);
if (friendList && friendList.length) { if (friendList && friendList.length) {
FriendInfoList.value = await takeUserAvatar(friendList); FriendInfoList.value = await takeUserAvatar(friendList);
} else { } else {
FriendInfoList.value = []; FriendInfoList.value = [];
formatAppLog("log", "at pages/Chat/Chat.vue:1229", "好友列表为空"); formatAppLog("log", "at pages/Chat/Chat.vue:1252", "好友列表为空");
} }
} catch (error) { } catch (error) {
formatAppLog("error", "at pages/Chat/Chat.vue:1232", "获取好友列表失败:", error); formatAppLog("error", "at pages/Chat/Chat.vue:1255", "获取好友列表失败:", error);
FriendInfoList.value = []; FriendInfoList.value = [];
} finally { } finally {
UserConversations.value = FriendInfoList.value; UserConversations.value = FriendInfoList.value;
@@ -6398,17 +6402,17 @@ This will fail in production.`);
}; };
}); });
} catch (err) { } catch (err) {
formatAppLog("error", "at pages/Chat/Chat.vue:1262", "获取好友头像失败", err); formatAppLog("error", "at pages/Chat/Chat.vue:1285", "获取好友头像失败", err);
return friendList; return friendList;
} }
}; };
const GroupList = vue.ref([]); const GroupList = vue.ref([]);
const takeGroupList = async () => { const takeGroupList = async () => {
try { try {
formatAppLog("log", "at pages/Chat/Chat.vue:1272", "开始获取群聊列表"); formatAppLog("log", "at pages/Chat/Chat.vue:1295", "开始获取群聊列表");
GroupList.value = await getGroup(UserId.value); GroupList.value = await getGroup(UserId.value);
} catch (error) { } catch (error) {
formatAppLog("error", "at pages/Chat/Chat.vue:1277", "获取群聊列表失败:", error); formatAppLog("error", "at pages/Chat/Chat.vue:1300", "获取群聊列表失败:", error);
GroupList.value = []; GroupList.value = [];
} finally { } finally {
UserConversations.value = GroupList.value; UserConversations.value = GroupList.value;
@@ -6420,22 +6424,22 @@ This will fail in production.`);
return []; return [];
try { try {
const memberIds = memberList.map((item) => item.groupContactId); const memberIds = memberList.map((item) => item.groupContactId);
formatAppLog("log", "at pages/Chat/Chat.vue:1291", "请求头像的ID列表:", memberIds); formatAppLog("log", "at pages/Chat/Chat.vue:1314", "请求头像的ID列表:", memberIds);
const memberAvatarList = await getUserAvatar(userToken.value, memberIds); const memberAvatarList = await getUserAvatar(userToken.value, memberIds);
formatAppLog("log", "at pages/Chat/Chat.vue:1293", "头像接口返回数据:", memberAvatarList); formatAppLog("log", "at pages/Chat/Chat.vue:1316", "头像接口返回数据:", memberAvatarList);
const userMap = new Map(memberAvatarList.map((user) => [user.user_id, user]) || []); const userMap = new Map(memberAvatarList.map((user) => [user.user_id, user]) || []);
formatAppLog("log", "at pages/Chat/Chat.vue:1296", "userMap的keys:", Array.from(userMap.keys())); formatAppLog("log", "at pages/Chat/Chat.vue:1319", "userMap的keys:", Array.from(userMap.keys()));
return memberList.map((member) => { return memberList.map((member) => {
const memberId = member.groupContactId; const memberId = member.groupContactId;
const userInfo = userMap.get(memberId); const userInfo = userMap.get(memberId);
formatAppLog("log", "at pages/Chat/Chat.vue:1301", `查找 ${memberId} 的头像:`, userInfo); formatAppLog("log", "at pages/Chat/Chat.vue:1324", `查找 ${memberId} 的头像:`, userInfo);
return { return {
...member, ...member,
avatar: (userInfo == null ? void 0 : userInfo.avatar) || null avatar: (userInfo == null ? void 0 : userInfo.avatar) || null
}; };
}); });
} catch (err) { } catch (err) {
formatAppLog("error", "at pages/Chat/Chat.vue:1308", "获取群成员头像失败", err); formatAppLog("error", "at pages/Chat/Chat.vue:1331", "获取群成员头像失败", err);
return memberList; return memberList;
} }
}; };
@@ -6462,6 +6466,8 @@ This will fail in production.`);
title: `获取ai会话内容失败${error}`, title: `获取ai会话内容失败${error}`,
icon: "none" icon: "none"
}); });
} finally {
isLoadingMessages.value = false;
} }
}; };
const takeFriendMessages = async () => { const takeFriendMessages = async () => {
@@ -6473,17 +6479,19 @@ This will fail in production.`);
title: `获取好友会话消息失败${error}`, title: `获取好友会话消息失败${error}`,
icon: "none" icon: "none"
}); });
} finally {
isLoadingMessages.value = false;
} }
}; };
const takeGroupMessages = async () => { const takeGroupMessages = async () => {
try { try {
allmessages.value = await getGroupMessages(currentSessionId.value) || []; allmessages.value = await getGroupMessages(currentSessionId.value) || [];
formatAppLog("log", "at pages/Chat/Chat.vue:1368", "群聊消息：", allmessages.value); formatAppLog("log", "at pages/Chat/Chat.vue:1395", "群聊消息：", allmessages.value);
const memberList = await getGroupMemberList(currentSessionId.value); const memberList = await getGroupMemberList(currentSessionId.value);
formatAppLog("log", "at pages/Chat/Chat.vue:1371", "获取到的群成员列表：", memberList); formatAppLog("log", "at pages/Chat/Chat.vue:1398", "获取到的群成员列表：", memberList);
if (memberList && memberList.length) { if (memberList && memberList.length) {
groupMemberList.value = await takeGroupMemberAvatar(memberList); groupMemberList.value = await takeGroupMemberAvatar(memberList);
formatAppLog("log", "at pages/Chat/Chat.vue:1374", "群成员列表（带头像）：", groupMemberList.value); formatAppLog("log", "at pages/Chat/Chat.vue:1401", "群成员列表（带头像）：", groupMemberList.value);
} else { } else {
groupMemberList.value = []; groupMemberList.value = [];
} }
@@ -6493,6 +6501,8 @@ This will fail in production.`);
title: `获取群聊会话失败${error}`, title: `获取群聊会话失败${error}`,
icon: "none" icon: "none"
}); });
} finally {
isLoadingMessages.value = false;
} }
}; };
const onScroll = (e2) => { const onScroll = (e2) => {
@@ -6505,9 +6515,9 @@ This will fail in production.`);
} }
}; };
vue.watch(() => friendSocketStore.MessageReceived, (newId) => { vue.watch(() => friendSocketStore.MessageReceived, (newId) => {
formatAppLog("log", "at pages/Chat/Chat.vue:1419", "收到了好友消息"); formatAppLog("log", "at pages/Chat/Chat.vue:1448", "收到了好友消息");
if (newId) { if (newId) {
formatAppLog("log", "at pages/Chat/Chat.vue:1421", "ChatType:", ChatType.value); formatAppLog("log", "at pages/Chat/Chat.vue:1450", "ChatType:", ChatType.value);
switch (ChatType.value) { switch (ChatType.value) {
case 0: case 0:
takeConversationMessages(); takeConversationMessages();
@@ -6522,7 +6532,7 @@ This will fail in production.`);
friendSocketStore.MessageReceived = false; friendSocketStore.MessageReceived = false;
break; break;
default: default:
formatAppLog("log", "at pages/Chat/Chat.vue:1437", "default 分支"); formatAppLog("log", "at pages/Chat/Chat.vue:1466", "default 分支");
friendSocketStore.MessageReceived = false; friendSocketStore.MessageReceived = false;
break; break;
} }
@@ -6530,9 +6540,13 @@ This will fail in production.`);
}, { }, {
immediate: true immediate: true
}); });
vue.watch(currentSessionId, (newId) => { vue.watch(currentSessionId, async (newId, oldId) => {
if (newId) { if (newId) {
uni.setStorageSync("currentSessionId", currentSessionId.value); uni.setStorageSync("currentSessionId", currentSessionId.value);
if (oldId && oldId !== newId) {
isLoadingMessages.value = true;
allmessages.value = [];
}
switch (ChatType.value) { switch (ChatType.value) {
case 0: case 0:
takeConversationMessages(); takeConversationMessages();
@@ -6540,10 +6554,10 @@ This will fail in production.`);
handleConnect(); handleConnect();
break; break;
case 1: case 1:
takeFriendMessages(); await takeFriendMessages();
break; break;
case 2: case 2:
takeGroupMessages(); await takeGroupMessages();
break; break;
default: default:
takeConversationMessages(); takeConversationMessages();
@@ -6566,6 +6580,7 @@ This will fail in production.`);
if (chatType === 0) { if (chatType === 0) {
await takeUserConversations(); await takeUserConversations();
if (currentSessionId.value) { if (currentSessionId.value) {
isLoadingMessages.value = true;
takeConversationMessages(); takeConversationMessages();
} }
if (userToken.value && currentSessionId.value && !socketStore.isConnected) { if (userToken.value && currentSessionId.value && !socketStore.isConnected) {
@@ -6573,18 +6588,20 @@ This will fail in production.`);
} }
} else if (chatType === 1) { } else if (chatType === 1) {
await takeFriendList(); await takeFriendList();
takeFriendMessages(); isLoadingMessages.value = true;
await takeFriendMessages();
handleFriendConnect(); handleFriendConnect();
} else if (chatType === 2) { } else if (chatType === 2) {
await takeGroupList(); await takeGroupList();
await handleFriendConnect(); await handleFriendConnect();
isLoadingMessages.value = true;
await takeGroupMessages(); await takeGroupMessages();
} }
}); });
onUnload(() => { onUnload(() => {
socketStore.disconnect(); socketStore.disconnect();
}); });
const __returned__ = { friendSocketStore, handleFriendConnect, socketStore, ChatType, convertMarkdownTable, renderTable, escapeLoneUnderscores, pareseMarkdown, sanitizeContent, previewImage, openFile, formatFileSize, parseFileInfo, selectNormalChat, showNewChatModal, closeNewChatModal, isChatSidebar, handleChatSidebar, goWorkSpace, goCloudDatabase, logOut, previewFileArray, uploadPhoto, deleteImage, fileList, uploadFile, handleConnect, isThinking, isSelfSent, isUploading, uploadedFiles, streamingMessageId, showMessageModal, detailLinks, handleChatContentClick, extractLinks, extractFileNameFromUrl, showMessageDetail, closeMessageDetail, downloadToast, get downloadToastTimer() { const __returned__ = { friendSocketStore, handleFriendConnect, socketStore, ChatType, convertMarkdownTable, renderTable, escapeLoneUnderscores, pareseMarkdown, sanitizeContent, previewImage, openFile, formatFileSize, parseFileInfo, selectNormalChat, showNewChatModal, closeNewChatModal, isChatSidebar, handleChatSidebar, goWorkSpace, goCloudDatabase, logOut, previewFileArray, uploadPhoto, deleteImage, fileList, uploadFile, handleConnect, isThinking, isSelfSent, isUploading, isLoadingMessages, uploadedFiles, streamingMessageId, showMessageModal, detailLinks, handleChatContentClick, extractLinks, extractFileNameFromUrl, showMessageDetail, closeMessageDetail, downloadToast, get downloadToastTimer() {
return downloadToastTimer; return downloadToastTimer;
}, set downloadToastTimer(v) { }, set downloadToastTimer(v) {
downloadToastTimer = v; downloadToastTimer = v;
@@ -6736,7 +6753,8 @@ This will fail in production.`);
"onUpdate:currentSessionId": _cache[2] || (_cache[2] = ($event) => $setup.currentSessionId = $event), "onUpdate:currentSessionId": _cache[2] || (_cache[2] = ($event) => $setup.currentSessionId = $event),
chatType: $setup.ChatType, chatType: $setup.ChatType,
"onUpdate:chatType": _cache[3] || (_cache[3] = ($event) => $setup.ChatType = $event), "onUpdate:chatType": _cache[3] || (_cache[3] = ($event) => $setup.ChatType = $event),
onRefreshConversations: $setup.takeUserConversations onRefreshConversations: $setup.takeUserConversations,
onSelectChat: _cache[4] || (_cache[4] = ($event) => $setup.isChatSidebar = false)
}, null, 8, ["chatList", "showNewChatModal", "currentSessionId", "chatType"]) }, null, 8, ["chatList", "showNewChatModal", "currentSessionId", "chatType"])
], ],
2 2
@@ -6781,6 +6799,19 @@ This will fail in production.`);
"scroll-with-animation": true, "scroll-with-animation": true,
onScroll: $setup.onScroll onScroll: $setup.onScroll
}, [ }, [
$setup.isLoadingMessages ? (vue.openBlock(), vue.createElementBlock("view", {
key: 0,
class: "messages-loading-overlay"
}, [
vue.createElementVNode("view", { class: "messages-loading-card" }, [
vue.createElementVNode("view", { class: "bubble-loading-dots" }, [
vue.createElementVNode("view", { class: "bubble-dot" }),
vue.createElementVNode("view", { class: "bubble-dot" }),
vue.createElementVNode("view", { class: "bubble-dot" })
]),
vue.createElementVNode("text", { class: "messages-loading-text" }, "加载中...")
])
])) : vue.createCommentVNode("v-if", true),
(vue.openBlock(true), vue.createElementBlock( (vue.openBlock(true), vue.createElementBlock(
vue.Fragment, vue.Fragment,
null, null,
@@ -6889,7 +6920,7 @@ This will fail in production.`);
)), )),
$setup.ChatType === 1 ? (vue.openBlock(true), vue.createElementBlock( $setup.ChatType === 1 ? (vue.openBlock(true), vue.createElementBlock(
vue.Fragment, vue.Fragment,
{ key: 0 }, { key: 1 },
vue.renderList($setup.currentMessages, (message, index) => { vue.renderList($setup.currentMessages, (message, index) => {
var _a; var _a;
return vue.openBlock(), vue.createElementBlock("view", { return vue.openBlock(), vue.createElementBlock("view", {
@@ -6982,7 +7013,7 @@ This will fail in production.`);
)) : vue.createCommentVNode("v-if", true), )) : vue.createCommentVNode("v-if", true),
$setup.ChatType === 2 ? (vue.openBlock(true), vue.createElementBlock( $setup.ChatType === 2 ? (vue.openBlock(true), vue.createElementBlock(
vue.Fragment, vue.Fragment,
{ key: 1 }, { key: 2 },
vue.renderList($setup.currentMessages, (message, index) => { vue.renderList($setup.currentMessages, (message, index) => {
var _a; var _a;
return vue.openBlock(), vue.createElementBlock("view", { return vue.openBlock(), vue.createElementBlock("view", {
@@ -7093,7 +7124,7 @@ This will fail in production.`);
"view", "view",
{ {
class: vue.normalizeClass(["chat-interactive-btn", { disabled: $setup.isThinking }]), class: vue.normalizeClass(["chat-interactive-btn", { disabled: $setup.isThinking }]),
onClick: _cache[4] || (_cache[4] = ($event) => !$setup.isThinking && $setup.uploadPhoto()) onClick: _cache[5] || (_cache[5] = ($event) => !$setup.isThinking && $setup.uploadPhoto())
}, },
"拍照上传", "拍照上传",
2 2
@@ -7103,7 +7134,7 @@ This will fail in production.`);
"view", "view",
{ {
class: vue.normalizeClass(["chat-interactive-btn", { disabled: $setup.isThinking }]), class: vue.normalizeClass(["chat-interactive-btn", { disabled: $setup.isThinking }]),
onClick: _cache[5] || (_cache[5] = ($event) => !$setup.isThinking && $setup.uploadFile()) onClick: _cache[6] || (_cache[6] = ($event) => !$setup.isThinking && $setup.uploadFile())
}, },
"上传文件", "上传文件",
2 2
@@ -7151,7 +7182,7 @@ This will fail in production.`);
class: "message-input", class: "message-input",
placeholder: $setup.isThinking ? $setup.isSelfSent ? "AI 正在回复中..." : "电脑正在运行，请稍后" : "输入消息...", placeholder: $setup.isThinking ? $setup.isSelfSent ? "AI 正在回复中..." : "电脑正在运行，请稍后" : "输入消息...",
disabled: $setup.isThinking, disabled: $setup.isThinking,
"onUpdate:modelValue": _cache[6] || (_cache[6] = ($event) => $setup.textMessage = $event), "onUpdate:modelValue": _cache[7] || (_cache[7] = ($event) => $setup.textMessage = $event),
"auto-height": "" "auto-height": ""
}, null, 8, ["placeholder", "disabled"]), [ }, null, 8, ["placeholder", "disabled"]), [
[vue.vModelText, $setup.textMessage] [vue.vModelText, $setup.textMessage]
@@ -7165,7 +7196,7 @@ This will fail in production.`);
])) : (vue.openBlock(), vue.createElementBlock("view", { ])) : (vue.openBlock(), vue.createElementBlock("view", {
key: 1, key: 1,
class: "input-btn-group send-message-btn", class: "input-btn-group send-message-btn",
onClick: _cache[7] || (_cache[7] = ($event) => $setup.sendMessage()) onClick: _cache[8] || (_cache[8] = ($event) => $setup.sendMessage())
}, [ }, [
vue.createElementVNode("view", { class: "iconfont icon-fasong" }) vue.createElementVNode("view", { class: "iconfont icon-fasong" })
])) ]))
@@ -7187,7 +7218,7 @@ This will fail in production.`);
}, [ }, [
vue.createElementVNode("view", { vue.createElementVNode("view", {
class: "ncd-card message-detail-card", class: "ncd-card message-detail-card",
onClick: _cache[8] || (_cache[8] = vue.withModifiers(() => { onClick: _cache[9] || (_cache[9] = vue.withModifiers(() => {
}, ["stop"])) }, ["stop"]))
}, [ }, [
vue.createElementVNode("view", { class: "ncd-header" }, [ vue.createElementVNode("view", { class: "ncd-header" }, [

28
unpackage/dist/dev/app-plus/pages/Chat/Chat.css vendored
View File

@@ -1742,6 +1742,34 @@ to { opacity: 1; transform: translateY(0);
transform: scale(1.1); transform: scale(1.1);
} }
} }
/* 消息加载中弹窗（仅会话变化时显示） */
.messages-loading-overlay {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
display: flex;
justify-content: center;
align-items: center;
background: rgba(255, 255, 255, 0.9);
z-index: 100;
}
.messages-loading-card {
display: flex;
flex-direction: column;
align-items: center;
padding: 1.25rem 1.875rem;
background: #ffffff;
border-radius: 0.75rem;
box-shadow: 0 0.25rem 1rem rgba(0, 0, 0, 0.12);
}
.messages-loading-text {
margin-top: 0.625rem;
font-size: 0.875rem;
color: #999;
}
/* 消息详情弹窗 — 链接提取区域 */ /* 消息详情弹窗 — 链接提取区域 */
.detail-links-section { .detail-links-section {
margin-top: 0.75rem; margin-top: 0.75rem;