fnvtk/cunkebao_v3
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(weChat): 优化聊天消息加载逻辑并移除无用按钮

Browse Source 
添加 isLoadingData 状态控制滚动行为
修改 loadChatMessages 方法支持分页加载
移除聊天窗口的语音和视频通话按钮
更新构建产物文件引用
This commit is contained in:
超级老白兔
2025-09-08 09:45:10 +08:00
parent b2db8e8f5a
commit 2033faff08
6 changed files with 56 additions and 43 deletions
Download Patch File Download Diff File Expand all files Collapse all files

26
Cunkebao/dist/.vite/manifest.json vendored
View File

@@ -1,18 +1,14 @@
{
"_charts-DmoeDXY2.js": {
"file": "assets/charts-DmoeDXY2.js",
"_charts-B9_ggjgM.js": {
"file": "assets/charts-B9_ggjgM.js",
"name": "charts",
"imports": [
"_ui-D66ihimQ.js",
"_ui-CdpU1706.js",
"_vendor-2vc8h_ct.js"
]
},
"_ui-D0C0OGrH.css": {
"file": "assets/ui-D0C0OGrH.css",
"src": "_ui-D0C0OGrH.css"
},
"_ui-D66ihimQ.js": {
"file": "assets/ui-D66ihimQ.js",
"_ui-CdpU1706.js": {
"file": "assets/ui-CdpU1706.js",
"name": "ui",
"imports": [
"_vendor-2vc8h_ct.js"
@@ -21,6 +17,10 @@
"assets/ui-D0C0OGrH.css"
]
},
"_ui-D0C0OGrH.css": {
"file": "assets/ui-D0C0OGrH.css",
"src": "_ui-D0C0OGrH.css"
},
"_utils-6WF66_dS.js": {
"file": "assets/utils-6WF66_dS.js",
"name": "utils",
@@ -33,18 +33,18 @@
"name": "vendor"
},
"index.html": {
"file": "assets/index-bW2KwNBi.js",
"file": "assets/index-BZQSHOtN.js",
"name": "index",
"src": "index.html",
"isEntry": true,
"imports": [
"_vendor-2vc8h_ct.js",
"_utils-6WF66_dS.js",
"_ui-D66ihimQ.js",
"_charts-DmoeDXY2.js"
"_ui-CdpU1706.js",
"_charts-B9_ggjgM.js"
],
"css": [
"assets/index-BeKt58rz.css"
"assets/index-CciB7EKw.css"
]
}
}

8
Cunkebao/dist/index.html vendored
View File

@@ -11,13 +11,13 @@
</style>
<!-- 引入 uni-app web-view SDK（必须） -->
<script type="text/javascript" src="/websdk.js"></script>
<script type="module" crossorigin src="/assets/index-bW2KwNBi.js"></script>
<script type="module" crossorigin src="/assets/index-BZQSHOtN.js"></script>
<link rel="modulepreload" crossorigin href="/assets/vendor-2vc8h_ct.js">
<link rel="modulepreload" crossorigin href="/assets/utils-6WF66_dS.js">
<link rel="modulepreload" crossorigin href="/assets/ui-D66ihimQ.js">
<link rel="modulepreload" crossorigin href="/assets/charts-DmoeDXY2.js">
<link rel="modulepreload" crossorigin href="/assets/ui-CdpU1706.js">
<link rel="modulepreload" crossorigin href="/assets/charts-B9_ggjgM.js">
<link rel="stylesheet" crossorigin href="/assets/ui-D0C0OGrH.css">
<link rel="stylesheet" crossorigin href="/assets/index-BeKt58rz.css">
<link rel="stylesheet" crossorigin href="/assets/index-CciB7EKw.css">
</head>
<body>
<div id="root"></div>

13
Cunkebao/src/pages/pc/ckbox/components/ChatWindow/components/MessageRecord/index.tsx
View File

@@ -13,13 +13,18 @@ interface MessageRecordProps {
const MessageRecord: React.FC<MessageRecordProps> = ({ contract }) => {
const messagesEndRef = useRef<HTMLDivElement>(null);
const currentMessages = useWeChatStore(state => state.currentMessages);
const loadChatMessages = useWeChatStore(state => state.loadChatMessages);
const messagesLoading = useWeChatStore(state => state.messagesLoading);
const isLoadingData = useWeChatStore(state => state.isLoadingData);
const currentGroupMembers = useWeChatStore(
state => state.currentGroupMembers,
);
useEffect(() => {
scrollToBottom();
}, [currentMessages]);
if (isLoadingData) {
scrollToBottom();
}
}, [currentMessages, isLoadingData]);
const scrollToBottom = () => {
messagesEndRef.current?.scrollIntoView({ behavior: "smooth" });
@@ -192,7 +197,9 @@ const MessageRecord: React.FC<MessageRecordProps> = ({ contract }) => {
return (
<div className={styles.messagesContainer}>
<div className={styles.loadMore}>点击加载更早的信息</div>
<div className={styles.loadMore} onClick={() => loadChatMessages(false)}>
点击加载更早的信息{messagesLoading ? "中" : "1"}
</div>
{groupMessagesByTime(currentMessages).map((group, groupIndex) => (
<React.Fragment key={`group-${groupIndex}`}>
<Divider>

15
Cunkebao/src/pages/pc/ckbox/components/ChatWindow/index.tsx
View File

@@ -68,21 +68,6 @@ const ChatWindow: React.FC<ChatWindowProps> = ({ contract }) => {
</div>
</div>
<Space>
<Tooltip title="语音通话">
<Button
type="text"
icon={<PhoneOutlined />}
className={styles.headerButton}
/>
</Tooltip>
<Tooltip title="视频通话">
<Button
type="text"
icon={<VideoCameraOutlined />}
className={styles.headerButton}
/>
</Tooltip>
<Tooltip title="个人资料">
<Button
onClick={onToggleProfile}

3
Cunkebao/src/store/module/weChat/weChat.data.ts
View File

@@ -9,6 +9,7 @@ export interface WeChatState {
// 消息加载状态
messagesLoading: boolean;
isLoadingData: boolean;
currentGroupMembers: any[];
// Actions
@@ -16,7 +17,7 @@ export interface WeChatState {
contract: ContractData | weChatGroup,
isExist?: boolean,
) => void;
loadChatMessages: (contact: ContractData | weChatGroup) => Promise<void>;
loadChatMessages: (Init: boolean, To?: number) => Promise<void>;
// 视频消息处理方法
setVideoLoading: (messageId: number, isLoading: boolean) => void;

34
Cunkebao/src/store/module/weChat/weChat.ts
View File

@@ -22,6 +22,7 @@ export const useWeChatStore = create<WeChatState>()(
currentContract: null,
currentMessages: [],
messagesLoading: false,
isLoadingData: false,
currentGroupMembers: [],
// Actions
@@ -43,18 +44,19 @@ export const useWeChatStore = create<WeChatState>()(
id: contract.id,
config: { chat: true },
});
state.loadChatMessages(contract);
state.loadChatMessages(true, 4704624000000);
});
},
loadChatMessages: async contact => {
loadChatMessages: async (Init: boolean, To?: number) => {
const state = useWeChatStore.getState();
const contact = state.currentContract;
set({ messagesLoading: true });
set({ isLoadingData: Init });
try {
const params: any = {
wechatAccountId: contact.wechatAccountId,
From: 1,
To: 4704624000000,
To: To || +new Date(),
Count: 5,
olderData: true,
};
@@ -65,11 +67,29 @@ export const useWeChatStore = create<WeChatState>()(
const currentGroupMembers = await getGroupMembers({
id: contact.id,
});
set({ currentMessages: messages || [], currentGroupMembers });
if (Init) {
set({ currentMessages: messages || [], currentGroupMembers });
} else {
set({
currentMessages: [
...state.currentMessages,
...(messages || []),
],
});
}
} else {
params.wechatFriendId = contact.id;
const messages = await getChatMessages(params);
set({ currentMessages: messages || [] });
if (Init) {
set({ currentMessages: messages || [] });
} else {
set({
currentMessages: [
...state.currentMessages,
...(messages || []),
],
});
}
}
} catch (error) {
console.error("获取聊天消息失败:", error);