736 lines
20 KiB
Vue
736 lines
20 KiB
Vue
<template>
|
||
<view class="message-page">
|
||
|
||
<!-- 消息列表 -->
|
||
<scroll-view
|
||
class="message-list"
|
||
scroll-y="true"
|
||
refresher-enabled
|
||
:refresher-triggered="refreshing"
|
||
@refresherrefresh="handleRefresh"
|
||
@scrolltolower="handleLoadMore"
|
||
>
|
||
<!-- 加载状态 -->
|
||
<view
|
||
v-if="loading && conversationList.length === 0"
|
||
class="loading-container"
|
||
>
|
||
<text class="loading-text">加载中...</text>
|
||
</view>
|
||
<!-- 消息列表项 -->
|
||
<view
|
||
v-for="conversation in conversationList"
|
||
:key="conversation.groupID || conversation.conversationID"
|
||
class="message-item"
|
||
@click="handleClickConversation(conversation)"
|
||
>
|
||
<view class="avatar-container">
|
||
<GroupAvatar
|
||
:avatarList="getAvatarList(conversation.groupID)"
|
||
:size="96"
|
||
classType="square"
|
||
/>
|
||
<view v-if="conversation.unreadCount > 0" class="unread-badge">
|
||
<text class="unread-text">{{
|
||
conversation.unreadCount > 99 ? "99+" : conversation.unreadCount
|
||
}}</text>
|
||
</view>
|
||
</view>
|
||
|
||
<view class="content">
|
||
<view class="header">
|
||
<text class="name">{{ conversation.teamName }}</text>
|
||
|
||
<text class="time">{{
|
||
formatMessageTime(conversation.lastMessageTime)
|
||
}}</text>
|
||
</view>
|
||
<view class="patient-info">
|
||
咨询人 | {{ conversation.patientName }}
|
||
</view>
|
||
<view class="message-preview">
|
||
<text class="preview-text">{{
|
||
cleanMessageText(conversation.lastMessage) || "暂无消息"
|
||
}}</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<!-- 空状态 -->
|
||
<view
|
||
v-if="!loading && conversationList.length === 0"
|
||
class="empty-container"
|
||
>
|
||
<image class="empty-image" src="/static/empty.svg" mode="aspectFit" />
|
||
<text class="empty-text">暂无消息</text>
|
||
</view>
|
||
|
||
<!-- 加载更多 -->
|
||
<view v-if="hasMore && conversationList.length > 0" class="load-more">
|
||
<text class="load-more-text">{{
|
||
loadingMore ? "加载中..." : "上拉加载更多"
|
||
}}</text>
|
||
</view>
|
||
</scroll-view>
|
||
</view>
|
||
</template>
|
||
|
||
<script setup>
|
||
import { ref, computed, onUnmounted } from "vue";
|
||
import { onLoad, onShow, onHide } from "@dcloudio/uni-app";
|
||
import { storeToRefs } from "pinia";
|
||
import useAccountStore from "@/store/account.js";
|
||
import { globalTimChatManager } from "@/utils/tim-chat.js";
|
||
import { mergeConversationWithGroupDetails } from "@/utils/conversation-merger.js";
|
||
import { globalUnreadListenerManager } from "@/utils/global-unread-listener.js";
|
||
import useGroupAvatars from "./hooks/use-group-avatars.js";
|
||
import GroupAvatar from "@/components/group-avatar.vue";
|
||
|
||
// 获取登录状态
|
||
const { account, openid, isIMInitialized } = storeToRefs(useAccountStore());
|
||
const { initIMAfterLogin } = useAccountStore();
|
||
|
||
// 状态
|
||
const conversationList = ref([]);
|
||
const loading = ref(false);
|
||
const loadingMore = ref(false);
|
||
const hasMore = ref(false);
|
||
const refreshing = ref(false);
|
||
|
||
// 群聊头像管理
|
||
const { loadGroupAvatars, getAvatarList } = useGroupAvatars();
|
||
|
||
// 计算总未读消息数
|
||
const totalUnreadCount = computed(() => {
|
||
return conversationList.value.reduce(
|
||
(sum, conv) => sum + (conv.unreadCount || 0),
|
||
0
|
||
);
|
||
});
|
||
|
||
// 立即更新未读徽章
|
||
const updateUnreadBadgeImmediately = async () => {
|
||
try {
|
||
if (!globalTimChatManager || !globalTimChatManager.tim) {
|
||
console.warn("TIM实例不存在，无法更新徽章");
|
||
return;
|
||
}
|
||
|
||
const response = await globalTimChatManager.tim.getConversationList();
|
||
|
||
if (!response || !response.data || !response.data.conversationList) {
|
||
console.warn("获取会话列表返回数据异常");
|
||
return;
|
||
}
|
||
|
||
// 计算群聊总未读数
|
||
const totalUnreadCount = response.data.conversationList
|
||
.filter(
|
||
(conv) => conv.conversationID && conv.conversationID.startsWith("GROUP")
|
||
)
|
||
.reduce((sum, conv) => sum + (conv.unreadCount || 0), 0);
|
||
try {
|
||
if (totalUnreadCount > 0) {
|
||
uni.setTabBarBadge({
|
||
index: 1,
|
||
text: totalUnreadCount > 99 ? "99+" : String(totalUnreadCount),
|
||
});
|
||
console.log("已更新 tabBar 徽章:", totalUnreadCount);
|
||
} else {
|
||
uni.setTabBarBadge({
|
||
index: 1,
|
||
text: "",
|
||
});
|
||
console.log("已清除 tabBar 徽章");
|
||
}
|
||
} catch (badgeError) {
|
||
console.error("更新TabBar徽章失败:", badgeError);
|
||
}
|
||
} catch (error) {
|
||
console.error("更新未读徽章失败:", error);
|
||
}
|
||
};
|
||
|
||
// 初始化IM
|
||
const initIM = async () => {
|
||
console.log("=== message.vue initIM 开始 ===");
|
||
console.log("isIMInitialized:", isIMInitialized.value);
|
||
console.log("globalTimChatManager 存在:", !!globalTimChatManager);
|
||
console.log("globalTimChatManager.tim 存在:", !!globalTimChatManager?.tim);
|
||
console.log(
|
||
"globalTimChatManager.isLoggedIn:",
|
||
globalTimChatManager?.isLoggedIn
|
||
);
|
||
|
||
if (!isIMInitialized.value) {
|
||
console.log("开始调用 initIMAfterLogin");
|
||
const success = await initIMAfterLogin();
|
||
console.log("initIMAfterLogin 返回:", success);
|
||
|
||
if (!success) {
|
||
console.log("initIMAfterLogin 失败，跳过 IM 初始化");
|
||
return false;
|
||
}
|
||
|
||
console.log("initIMAfterLogin 成功后检查:");
|
||
console.log("- globalTimChatManager 存在:", !!globalTimChatManager);
|
||
console.log(
|
||
"- globalTimChatManager.tim 存在:",
|
||
!!globalTimChatManager?.tim
|
||
);
|
||
console.log(
|
||
"- globalTimChatManager.isLoggedIn:",
|
||
globalTimChatManager?.isLoggedIn
|
||
);
|
||
} else if (globalTimChatManager && !globalTimChatManager.isLoggedIn) {
|
||
console.log("IM 已初始化但未登录，尝试重连");
|
||
const reconnected = await globalTimChatManager.ensureIMConnection();
|
||
|
||
if (!reconnected) {
|
||
console.log("重连失败");
|
||
return false;
|
||
}
|
||
}
|
||
|
||
console.log("=== message.vue initIM 完成 ===");
|
||
return true;
|
||
};
|
||
|
||
// 加载会话列表
|
||
const loadConversationList = async () => {
|
||
if (loading.value) return;
|
||
// loading.value = true;
|
||
|
||
try {
|
||
console.log("开始加载群聊列表");
|
||
|
||
// 验证 IM 管理器和 TIM 实例是否存在
|
||
if (!globalTimChatManager) {
|
||
console.log("IM管理器未初始化，跳过加载");
|
||
return;
|
||
}
|
||
|
||
if (!globalTimChatManager.tim) {
|
||
console.log("TIM实例不存在，尝试重新初始化");
|
||
const imReady = await initIM();
|
||
if (!imReady || !globalTimChatManager.tim) {
|
||
console.log("TIM实例初始化失败，跳过加载");
|
||
return;
|
||
}
|
||
}
|
||
|
||
if (!globalTimChatManager.getGroupList) {
|
||
console.log("getGroupList 方法不存在，跳过加载");
|
||
return;
|
||
}
|
||
|
||
// 直接调用getGroupList，它会自动等待SDK就绪
|
||
const result = await globalTimChatManager.getGroupList();
|
||
if (result && result.success && result.groupList) {
|
||
// 合并后端群组详细信息（已包含格式化和排序）
|
||
conversationList.value = await mergeConversationWithGroupDetails(
|
||
result.groupList
|
||
);
|
||
console.log(
|
||
"群聊列表加载成功，共",
|
||
conversationList.value.length,
|
||
"个会话"
|
||
);
|
||
|
||
// 加载所有群聊的头像
|
||
await loadGroupAvatars(conversationList.value);
|
||
} else {
|
||
console.log("加载群聊列表失败或返回数据为空");
|
||
}
|
||
} catch (error) {
|
||
console.log("加载会话列表异常:", error.message);
|
||
} finally {
|
||
loading.value = false;
|
||
}
|
||
};
|
||
|
||
// 防抖更新定时器
|
||
let updateTimer = null;
|
||
|
||
// 会话列表更新处理函数
|
||
const handleConversationListUpdate = async (eventData) => {
|
||
console.log("【消息列表页】会话列表更新事件:", eventData);
|
||
|
||
// 处理单个会话更新（标记已读的情况）
|
||
if (eventData && !Array.isArray(eventData) && eventData.conversationID) {
|
||
const conversationID = eventData.conversationID;
|
||
const existingIndex = conversationList.value.findIndex(
|
||
(conv) => conv.conversationID === conversationID
|
||
);
|
||
|
||
if (existingIndex !== -1) {
|
||
// 直接更新未读数，避免触发整个对象的响应式更新
|
||
if (eventData.unreadCount !== undefined) {
|
||
conversationList.value[existingIndex].unreadCount =
|
||
eventData.unreadCount;
|
||
console.log(
|
||
`【消息列表页】已更新会话未读数: ${conversationList.value[existingIndex].name}, unreadCount: ${eventData.unreadCount}`
|
||
);
|
||
}
|
||
// 更新最后消息
|
||
if (eventData.lastMessage) {
|
||
conversationList.value[existingIndex].lastMessage = eventData.lastMessage.messageForShow || '';
|
||
conversationList.value[existingIndex].lastMessageTime = eventData.lastMessage.lastTime || Date.now();
|
||
// 重新排序
|
||
conversationList.value.sort((a, b) => b.lastMessageTime - a.lastMessageTime);
|
||
}
|
||
}
|
||
return;
|
||
}
|
||
|
||
// eventData 是一个数组，包含所有更新的会话
|
||
if (!eventData || !Array.isArray(eventData)) {
|
||
console.warn("【消息列表页】会话列表更新事件数据格式错误");
|
||
return;
|
||
}
|
||
|
||
// 防抖处理：避免频繁更新导致闪动
|
||
if (updateTimer) {
|
||
clearTimeout(updateTimer);
|
||
}
|
||
|
||
updateTimer = setTimeout(async () => {
|
||
// 过滤出群聊会话
|
||
const groupConversations = eventData.filter(
|
||
(conv) => conv.conversationID && conv.conversationID.startsWith("GROUP")
|
||
);
|
||
|
||
console.log(`【消息列表页】收到 ${groupConversations.length} 个群聊会话更新`);
|
||
|
||
// 使用 TimChatManager 的格式化方法转换为标准格式
|
||
const formattedConversations = groupConversations.map((conv) =>
|
||
globalTimChatManager.formatConversationData(conv)
|
||
);
|
||
|
||
// 合并后端群组详细信息（已包含格式化和排序）
|
||
const mergedConversations = await mergeConversationWithGroupDetails(
|
||
formattedConversations
|
||
);
|
||
|
||
if (!mergedConversations || mergedConversations.length === 0) {
|
||
console.log("【消息列表页】合并后的会话数据为空，跳过更新");
|
||
return;
|
||
}
|
||
|
||
let needSort = false;
|
||
|
||
// 更新会话列表
|
||
mergedConversations.forEach((conversationData) => {
|
||
const conversationID = conversationData.conversationID;
|
||
const existingIndex = conversationList.value.findIndex(
|
||
(conv) => conv.conversationID === conversationID
|
||
);
|
||
|
||
if (existingIndex !== -1) {
|
||
const existing = conversationList.value[existingIndex];
|
||
// 只在关键字段变化时才更新，减少不必要的渲染
|
||
if (
|
||
existing.lastMessage !== conversationData.lastMessage ||
|
||
existing.lastMessageTime !== conversationData.lastMessageTime ||
|
||
existing.unreadCount !== conversationData.unreadCount
|
||
) {
|
||
// 只更新变化的字段，保持头像稳定
|
||
conversationList.value[existingIndex] = {
|
||
...conversationData,
|
||
// 保持原有头像，避免闪动
|
||
avatar: existing.avatar || conversationData.avatar,
|
||
// 直接使用 TIM SDK 返回的未读数
|
||
unreadCount: conversationData.unreadCount || 0
|
||
};
|
||
needSort = true;
|
||
console.log(
|
||
`【消息列表页】已更新会话: ${conversationData.name}, unreadCount: ${conversationList.value[existingIndex].unreadCount}`
|
||
);
|
||
}
|
||
} else {
|
||
// 添加新会话
|
||
conversationList.value.push(conversationData);
|
||
needSort = true;
|
||
console.log(`【消息列表页】已添加新会话: ${conversationData.name}`);
|
||
}
|
||
});
|
||
|
||
// 只在需要时才排序
|
||
if (needSort) {
|
||
conversationList.value.sort(
|
||
(a, b) => b.lastMessageTime - a.lastMessageTime
|
||
);
|
||
}
|
||
}, 100); // 100ms 防抖延迟
|
||
};
|
||
|
||
// 消息接收处理函数
|
||
const handleMessageReceived = (message) => {
|
||
console.log("【消息列表页】收到新消息:", message);
|
||
// TIM SDK 会在收到新消息时自动更新会话的未读数，并触发 onConversationListUpdated 事件
|
||
// 因此这里不需要手动处理，只记录日志
|
||
};
|
||
|
||
// 设置会话列表监听，实时更新列表
|
||
const setupConversationListener = () => {
|
||
if (!globalTimChatManager) return;
|
||
|
||
console.log("【消息列表页】设置会话监听器");
|
||
|
||
// 将回调添加到全局未读监听器的回调链中
|
||
// 这样不会覆盖全局未读监听器，而是与之共存
|
||
if (globalUnreadListenerManager.isInitialized) {
|
||
// globalUnreadListenerManager.addCallback("onConversationListUpdated", handleConversationListUpdate);
|
||
// globalUnreadListenerManager.addCallback("onMessageReceived", handleMessageReceived);
|
||
console.log("【消息列表页】已添加回调到全局监听器回调链");
|
||
} else {
|
||
console.warn("【消息列表页】全局未读监听器未初始化，使用直接回调方式");
|
||
// 如果全局监听器未初始化，直接设置回调（兼容处理）
|
||
globalTimChatManager.setCallback("onConversationListUpdated", handleConversationListUpdate);
|
||
globalTimChatManager.setCallback("onMessageReceived", handleMessageReceived);
|
||
}
|
||
};
|
||
|
||
// 格式化消息时间
|
||
const formatMessageTime = (timestamp) => {
|
||
if (!timestamp) return "";
|
||
|
||
const now = Date.now();
|
||
const diff = now - timestamp;
|
||
const date = new Date(timestamp);
|
||
|
||
// 1分钟内
|
||
if (diff < 60 * 1000) {
|
||
return "刚刚";
|
||
}
|
||
|
||
// 1小时内
|
||
if (diff < 60 * 60 * 1000) {
|
||
return `${Math.floor(diff / (60 * 1000))}分钟前`;
|
||
}
|
||
|
||
// 今天
|
||
const today = new Date();
|
||
if (date.toDateString() === today.toDateString()) {
|
||
return `${String(date.getHours()).padStart(2, "0")}:${String(
|
||
date.getMinutes()
|
||
).padStart(2, "0")}`;
|
||
}
|
||
|
||
// 昨天
|
||
const yesterday = new Date(today);
|
||
yesterday.setDate(yesterday.getDate() - 1);
|
||
if (date.toDateString() === yesterday.toDateString()) {
|
||
return "昨天";
|
||
}
|
||
|
||
// 今年
|
||
if (date.getFullYear() === today.getFullYear()) {
|
||
return `${date.getMonth() + 1}月${date.getDate()}日`;
|
||
}
|
||
|
||
// 其他
|
||
return `${date.getFullYear()}年${date.getMonth() + 1}月${date.getDate()}日`;
|
||
};
|
||
|
||
// 点击会话
|
||
const handleClickConversation = async (conversation) => {
|
||
console.log("点击会话:", conversation);
|
||
|
||
// 立即清除本地未读数显示
|
||
const conversationIndex = conversationList.value.findIndex(
|
||
(conv) => conv.conversationID === conversation.conversationID
|
||
);
|
||
if (conversationIndex !== -1) {
|
||
conversationList.value[conversationIndex].unreadCount = 0;
|
||
}
|
||
|
||
// 标记会话为已读
|
||
if (globalTimChatManager && globalTimChatManager.tim) {
|
||
try {
|
||
await globalTimChatManager.tim.setMessageRead({
|
||
conversationID: conversation.conversationID,
|
||
});
|
||
console.log("✓ 已标记会话为已读:", conversation.conversationID);
|
||
|
||
// 立即刷新 tabBar 徽章
|
||
// await globalUnreadListenerManager.refreshBadge();
|
||
} catch (error) {
|
||
console.error("✗ 标记会话已读失败:", error);
|
||
}
|
||
}
|
||
|
||
// 跳转到聊天页面
|
||
uni.navigateTo({
|
||
url: `/pages/message/index?conversationID=${conversation.conversationID}&groupID=${conversation.groupID}`,
|
||
});
|
||
};
|
||
|
||
// 加载更多
|
||
const handleLoadMore = () => {
|
||
if (loadingMore.value || !hasMore.value) return;
|
||
|
||
loadingMore.value = true;
|
||
// TODO: 实现分页加载
|
||
setTimeout(() => {
|
||
loadingMore.value = false;
|
||
}, 1000);
|
||
};
|
||
|
||
// 下拉刷新
|
||
const handleRefresh = async () => {
|
||
refreshing.value = true;
|
||
|
||
try {
|
||
await loadConversationList();
|
||
} finally {
|
||
refreshing.value = false;
|
||
}
|
||
};
|
||
|
||
// 页面加载
|
||
onLoad( async() => {
|
||
try {
|
||
// 初始化IM
|
||
const imReady = await initIM();
|
||
if (!imReady) {
|
||
console.log("IM初始化失败，继续加载列表");
|
||
}
|
||
// 先加载初始会话列表
|
||
await loadConversationList();
|
||
// 再设置监听器，后续通过事件更新列表
|
||
setupConversationListener();
|
||
} catch (error) {
|
||
console.log("页面初始化异常:", error.message);
|
||
}
|
||
});
|
||
|
||
// 清理消息文本（移除换行符）
|
||
const cleanMessageText = (text) => {
|
||
if (!text) return "";
|
||
return text.replace(/[\r\n]+/g, " ").trim();
|
||
};
|
||
|
||
// 页面显示
|
||
onShow(async () => {
|
||
// 页面显示时刷新 tabBar 徽章
|
||
// if (globalUnreadListenerManager.isInitialized) {
|
||
// await globalUnreadListenerManager.refreshBadge();
|
||
// }
|
||
});
|
||
|
||
// 页面隐藏
|
||
onHide(() => {
|
||
console.log("【消息列表页】页面隐藏");
|
||
|
||
// 清除防抖定时器
|
||
if (updateTimer) {
|
||
clearTimeout(updateTimer);
|
||
updateTimer = null;
|
||
}
|
||
|
||
// 注意：不要清除 globalTimChatManager 的回调
|
||
// 因为全局未读监听器需要持续工作
|
||
// 回调链会在页面销毁时自动清理
|
||
});
|
||
|
||
// 页面卸载
|
||
onUnmounted(() => {
|
||
console.log("【消息列表页】页面卸载，清理回调");
|
||
|
||
// 清除防抖定时器
|
||
if (updateTimer) {
|
||
clearTimeout(updateTimer);
|
||
updateTimer = null;
|
||
}
|
||
|
||
// // 从全局未读监听器的回调链中移除本页面的回调
|
||
// if (globalUnreadListenerManager.isInitialized) {
|
||
// globalUnreadListenerManager.removeCallback("onConversationListUpdated", handleConversationListUpdate);
|
||
// globalUnreadListenerManager.removeCallback("onMessageReceived", handleMessageReceived);
|
||
// console.log("【消息列表页】已从回调链移除回调");
|
||
// }
|
||
});
|
||
</script>
|
||
|
||
<style scoped lang="scss">
|
||
.message-page {
|
||
width: 100%;
|
||
height: 100vh;
|
||
background-color: #f5f5f5;
|
||
display: flex;
|
||
flex-direction: column;
|
||
}
|
||
|
||
.message-header {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
padding: 24rpx 32rpx;
|
||
background-color: #fff;
|
||
border-bottom: 1rpx solid #f0f0f0;
|
||
}
|
||
|
||
.header-title {
|
||
font-size: 36rpx;
|
||
font-weight: 600;
|
||
color: #000;
|
||
}
|
||
|
||
.total-unread-badge {
|
||
min-width: 40rpx;
|
||
height: 40rpx;
|
||
padding: 0 12rpx;
|
||
background-color: #ff4d4f;
|
||
border-radius: 20rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
}
|
||
|
||
.badge-text {
|
||
font-size: 24rpx;
|
||
color: #fff;
|
||
font-weight: 600;
|
||
line-height: 1;
|
||
}
|
||
|
||
.message-list {
|
||
flex: 1;
|
||
width: 100%;
|
||
}
|
||
|
||
.loading-container,
|
||
.empty-container {
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: center;
|
||
justify-content: center;
|
||
padding: 100rpx 0;
|
||
}
|
||
|
||
.loading-text {
|
||
font-size: 28rpx;
|
||
color: #999;
|
||
}
|
||
|
||
.empty-image {
|
||
width: 200rpx;
|
||
height: 200rpx;
|
||
margin-bottom: 20rpx;
|
||
}
|
||
|
||
.empty-text {
|
||
font-size: 28rpx;
|
||
color: #999;
|
||
}
|
||
|
||
.message-item {
|
||
display: flex;
|
||
align-items: center;
|
||
padding: 24rpx 32rpx;
|
||
background-color: #fff;
|
||
border-bottom: 1rpx solid #f0f0f0;
|
||
|
||
&:active {
|
||
background-color: #f5f5f5;
|
||
}
|
||
}
|
||
|
||
.avatar-container {
|
||
position: relative;
|
||
margin-right: 24rpx;
|
||
flex-shrink: 0;
|
||
}
|
||
|
||
.avatar {
|
||
width: 96rpx;
|
||
height: 96rpx;
|
||
border-radius: 8rpx;
|
||
}
|
||
|
||
.unread-badge {
|
||
position: absolute;
|
||
top: -8rpx;
|
||
right: -8rpx;
|
||
min-width: 32rpx;
|
||
height: 32rpx;
|
||
padding: 0 8rpx;
|
||
background-color: #ff4d4f;
|
||
border-radius: 16rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
}
|
||
|
||
.unread-text {
|
||
font-size: 20rpx;
|
||
color: #fff;
|
||
line-height: 1;
|
||
}
|
||
|
||
.content {
|
||
flex: 1;
|
||
display: flex;
|
||
flex-direction: column;
|
||
justify-content: center;
|
||
min-width: 0;
|
||
}
|
||
|
||
.header {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
margin-bottom: 8rpx;
|
||
}
|
||
|
||
.name {
|
||
font-size: 32rpx;
|
||
font-weight: 500;
|
||
color: #333;
|
||
flex: 1;
|
||
overflow: hidden;
|
||
text-overflow: ellipsis;
|
||
white-space: nowrap;
|
||
}
|
||
|
||
.time {
|
||
font-size: 24rpx;
|
||
color: #999;
|
||
margin-left: 16rpx;
|
||
flex-shrink: 0;
|
||
}
|
||
|
||
.message-preview {
|
||
display: flex;
|
||
align-items: center;
|
||
min-width: 0;
|
||
}
|
||
|
||
.preview-text {
|
||
font-size: 26rpx;
|
||
color: #999;
|
||
overflow: hidden;
|
||
text-overflow: ellipsis;
|
||
white-space: nowrap;
|
||
flex: 1;
|
||
min-width: 0;
|
||
}
|
||
|
||
.load-more {
|
||
padding: 20rpx 0;
|
||
text-align: center;
|
||
}
|
||
|
||
.load-more-text {
|
||
font-size: 24rpx;
|
||
color: #999;
|
||
}
|
||
|
||
.patient-info {
|
||
font-size: 26rpx;
|
||
color: #999;
|
||
padding-bottom: 10rpx;
|
||
}
|
||
</style>
|