diff --git a/pages/chat/components/messageList.vue b/pages/chat/components/messageList.vue index 95a19e9e..e014a068 100644 --- a/pages/chat/components/messageList.vue +++ b/pages/chat/components/messageList.vue @@ -34,10 +34,12 @@ import KeFuApi from '@/sheep/api/promotion/kefu'; import { isEmpty } from '@/sheep/helper/utils'; import sheep from '@/sheep'; - + import { formatDate } from '@/sheep/util'; + const sys_navBar = sheep.$platform.navbar; const messageList = ref([]); // 消息列表 const showNewMessageTip = ref(false); // 显示有新消息提示 + const refreshMessage = ref(false); // 更新消息列表 const backToTopStyle = reactive({ 'width': '100px', 'background-color': '#fff', @@ -48,8 +50,9 @@ 'alignItems': 'center', }); // 返回顶部样式 const queryParams = reactive({ - pageNo: 1, - pageSize: 10, + pageNo: 1, // 只用于触底计算 + pageSize: 20, + createTime: undefined, }); const pagingRef = ref(null); // 虚拟列表 const queryList = async (pageNo, pageSize) => { @@ -61,21 +64,47 @@ }; // 获得消息分页列表 const getMessageList = async () => { - const { data } = await KeFuApi.getKefuMessagePage(queryParams); - if (isEmpty(data.list)) { + const { data } = await KeFuApi.getKefuMessageList(queryParams); + if (isEmpty(data)) { + pagingRef.value.completeByNoMore([], true); return; } - pagingRef.value.completeByTotal(data.list, data.total); + if (queryParams.pageNo > 1 && refreshMessage.value) { + const newMessageList = []; + for (const message of data) { + if (messageList.value.some((val) => val.id === message.id)) { + continue; + } + newMessageList.push(message); + } + // 新消息追加到开头 + messageList.value = [...newMessageList, ...messageList.value]; + pagingRef.value.updateCache(); // 更新缓存 + refreshMessage.value = false; // 更新好后重置状态 + return; + } + + // 设置最后一次历史查询的最后一条消息的 createTime + queryParams.createTime = formatDate(data.at(-1).createTime); + pagingRef.value.completeByNoMore(data, false); }; /** 刷新消息列表 */ - const refreshMessageList = (message = undefined) => { - if (message !== undefined) { - showNewMessageTip.value = true; + const refreshMessageList = async (message = undefined) => { + if (typeof message !== 'undefined') { // 追加数据 pagingRef.value.addChatRecordData([message], false); - return; + } else { + queryParams.createTime = undefined; + refreshMessage.value = true; + await getMessageList(); + } + + // 若已是第一页则不做处理 + if (queryParams.pageNo > 1) { + showNewMessageTip.value = true; + } else { + onScrollToUpper(); } - pagingRef.value.reload(); }; /** 滚动到最新消息 */ const onBackToTopClick = (event) => { diff --git a/pages/chat/components/messageListItem.vue b/pages/chat/components/messageListItem.vue index 06a718de..a0120902 100644 --- a/pages/chat/components/messageListItem.vue +++ b/pages/chat/components/messageListItem.vue @@ -46,7 +46,7 @@