hookehuyr

style(messages): 调整对话列表样式和布局

移除不必要的边距和固定高度,使布局更灵活
将 content-container 重命名为 content-container1 以保持命名一致性
......@@ -41,7 +41,7 @@
@scrolltolower="loadMore" @scroll="scroll" :lower-threshold="20" :enable-flex="false"
:scroll-top="scrollTop">
<view v-for="conversation in filteredConversations" :key="conversation.id"
class="conversation-item mt-2 mb-4 border-b border-gray-100 pb-2"
class="conversation-item border-b border-gray-100 pb-2"
@click="onConversationClick(conversation)">
<view class="flex items-start">
<view class="avatar-container flex-shrink-0">
......@@ -53,7 +53,7 @@
</view>
</view>
</view>
<view class="content-container flex-1 min-w-0">
<view class="content-container1 flex-1 min-w-0">
<view class="flex justify-between items-center mb-1">
<text class="font-medium flex-1 mr-2 truncate">{{ conversation.name }}</text>
<view class="flex items-center flex-shrink-0">
......@@ -109,7 +109,7 @@ import { getMessagesListAPI, getMessagesDetailAPI } from '@/api/chat'
const defaultAvatar = 'https://cdn.ipadbiz.cn/mlaj/images/icon_1.jpeg'
const scrollStyle = ref({
height: 'calc(100vh - 500rpx)'
height: 'auto'
})
// 滚动相关变量
......@@ -509,9 +509,7 @@ onUnmounted(() => {
/* 对话列表样式 */
.conversation-list {
height: calc(100vh - 500rpx);
background: #ffffff;
overflow: hidden;
box-sizing: border-box;
}
......@@ -524,7 +522,6 @@ onUnmounted(() => {
padding: 24rpx 20rpx;
border-bottom: 1rpx solid #f0f0f0;
transition: background-color 0.2s;
margin: 20rpx 0;
}
.avatar-container {
......@@ -533,7 +530,7 @@ onUnmounted(() => {
flex-shrink: 0;
}
.content-container {
.content-container1 {
flex: 1;
min-width: 0;
padding-left: 8rpx;
......