Files
xingque/pages/messages/messages.wxml
2026-07-09 00:17:03 +08:00

90 lines
4.7 KiB
Plaintext

<view class="msg-page">
<!-- 顶部搜索 + 通知 -->
<view class="header">
<view class="search-bar">
<input class="search-input" placeholder="搜索订单/用户ID/昵称" bindinput="onSearchInput" value="{{searchKeyword}}" />
<text class="search-icon">🔍</text>
</view>
<view class="notify-switch" bindtap="toggleNotification">
<text class="notify-text">{{notificationMuted ? '静音' : '通知'}}</text>
</view>
</view>
<view class="im-status-bar im-status-bar--warn" wx:if="{{imStatusText}}" bindtap="retryImConnection">
<text class="im-status-icon">⚠</text>
<text class="im-status-text">{{imStatusText}},点击重连</text>
</view>
<!-- 标签栏 -->
<view class="tab-row">
<view class="tab-item {{activeTab === 0 ? 'active' : ''}}" data-index="0" bindtap="switchTab">
<text class="tab-label">订单消息</text>
<text class="tab-badge" wx:if="{{tabUnread && tabUnread[0] > 0}}">{{tabUnread[0]}}</text>
</view>
<view class="tab-item {{activeTab === 1 ? 'active' : ''}}" data-index="1" bindtap="switchTab">
<text class="tab-label">用户消息</text>
<text class="tab-badge" wx:if="{{tabUnread && tabUnread[1] > 0}}">{{tabUnread[1]}}</text>
</view>
<view class="tab-item {{activeTab === 2 ? 'active' : ''}}" data-index="2" bindtap="switchTab">
<text class="tab-label">客服消息</text>
<text class="tab-badge" wx:if="{{tabUnread && tabUnread[2] > 0}}">{{tabUnread[2]}}</text>
</view>
</view>
<view class="kefu-entry" wx:if="{{activeTab === 2}}">
<button class="kefu-btn" bindtap="chatKefu">💬 联系客服</button>
</view>
<!-- 会话列表 (上拉加载更多) -->
<scroll-view class="conversation-list" scroll-y="true" bindscrolltolower="onScrollToLower" style="height: {{scrollHeight}}px">
<block wx:for="{{filteredConversations}}" wx:key="key" wx:for-index="i" wx:if="{{i < displayCount}}">
<view class="conversation-item {{item.unread > 0 ? 'has-unread' : ''}} {{item.type === 'group' ? 'order-group-item' : ''}}" data-conversation="{{item}}" bindtap="chat" bindlongpress="showAction">
<image class="avatar {{item.type === 'group' ? 'avatar-round' : ''}}" src="{{item.data.avatar || defaultAvatarUrl}}" mode="aspectFill" binderror="onAvatarError" data-index="{{i}}" />
<view class="info">
<view class="top-line">
<view class="name-col">
<text class="name">{{item.data.name || '用户'}}</text>
<text class="uid-tag" wx:if="{{item.data.counterpartYonghuid}}">ID {{item.data.counterpartYonghuid}}</text>
</view>
<text class="time">{{item.lastMessage.date}}</text>
</view>
<block wx:if="{{item.type === 'group'}}">
<view class="bottom-line">
<text class="last-msg">{{item.displayLastMsg || item.lastMessage.payload.text}}</text>
<view class="unread-dot" wx:if="{{item.unread > 0}}">{{item.unread > 99 ? '99+' : item.unread}}</view>
</view>
<view class="order-compact" wx:if="{{item.data.orderId || item.data.orderDesc}}">
<view class="order-compact-row" wx:if="{{item.data.orderId}}">
<text class="order-id-tag">单号</text>
<text class="order-id-text">{{item.data.orderId}}</text>
<text class="order-status-inline" wx:if="{{item.data.orderZhuangtaiText}}">{{item.data.orderZhuangtaiText}}</text>
</view>
<text class="order-desc-compact" wx:if="{{item.data.orderDesc}}">{{item.data.orderDesc}}</text>
</view>
</block>
<view class="bottom-line" wx:else>
<text class="last-msg">{{item.lastMessage.type === 'text' ? item.lastMessage.payload.text : (item.lastMessage.type === 'image' ? '[图片]' : '[其他消息]')}}</text>
<view class="unread-dot" wx:if="{{item.unread > 0}}">{{item.unread > 99 ? '99+' : item.unread}}</view>
</view>
</view>
</view>
</block>
<view class="load-tip" wx:if="{{filteredConversations.length > displayCount}}">上拉加载更多</view>
<view class="empty" wx:if="{{filteredConversations.length === 0 && activeTab !== 2}}">
<text>暂无相关消息</text>
</view>
</scroll-view>
<view class="action-mask" wx:if="{{actionPopup.visible}}" catchtap="closeMask">
<view class="action-sheet">
<view class="action-btn" bindtap="topConversation">{{actionPopup.conversation.top ? '取消置顶' : '置顶聊天'}}</view>
<view class="action-btn" bindtap="removeConversation">删除聊天</view>
<view class="action-btn cancel" catchtap="closeMask">取消</view>
</view>
</view>
<tab-bar />
<global-notification id="global-notification" />
</view>