54 行
2.5 KiB
Plaintext
54 行
2.5 KiB
Plaintext
|
<view class="chat-container">
|
||
|
|
<view class="header">
|
||
|
|
<text class="status {{connected ? 'online' : 'offline'}}">{{connected ? '已连接' : '未连接'}}</text>
|
||
|
|
<text class="user">当前用户: {{userId}}</text>
|
||
|
|
</view>
|
||
|
|
|
||
|
|
<view class="sidebar">
|
||
|
|
<view class="tab-bar">
|
||
|
|
<view class="tab {{activeTab==='conv'?'active':''}}" bindtap="switchTab" data-tab="conv">会话</view>
|
||
|
|
<view class="tab {{activeTab==='friend'?'active':''}}" bindtap="switchTab" data-tab="friend">好友</view>
|
||
|
|
</view>
|
||
|
|
|
||
|
|
<scroll-view scroll-y class="list">
|
||
|
|
<block wx:if="{{activeTab==='conv'}}">
|
||
|
|
<view wx:for="{{conversations}}" wx:key="targetId" class="item" bindtap="selectConv" data-id="{{item.targetId}}" data-type="{{item.chatType}}">
|
||
|
|
<view class="item-title">{{item.targetId}}</view>
|
||
|
|
<view class="item-meta">{{item.lastMsgContent||'暂无消息'}}</view>
|
||
|
|
</view>
|
||
|
|
<view wx:if="{{conversations.length===0}}" class="empty">暂无会话</view>
|
||
|
|
</block>
|
||
|
|
|
||
|
|
<block wx:if="{{activeTab==='friend'}}">
|
||
|
|
<view wx:for="{{friends}}" wx:key="*this" class="item" bindtap="startChat" data-id="{{item}}">
|
||
|
|
<view class="item-title">{{item}}</view>
|
||
|
|
</view>
|
||
|
|
<view wx:if="{{friends.length===0}}" class="empty">暂无好友</view>
|
||
|
|
</block>
|
||
|
|
</scroll-view>
|
||
|
|
</view>
|
||
|
|
|
||
|
|
<view class="chat-area" wx:if="{{currentTarget}}">
|
||
|
|
<view class="chat-header">{{currentTarget}} ({{currentChatType==='SINGLE'?'单聊':'群聊'}})</view>
|
||
|
|
<scroll-view scroll-y class="message-list" scroll-into-view="msg-{{messages.length-1}}">
|
||
|
|
<view wx:for="{{messages}}" wx:key="id" id="msg-{{index}}" class="msg-row {{item.fromId===userId?'self':'other'}}">
|
||
|
|
<view class="msg-bubble">
|
||
|
|
<view class="msg-sender">{{item.fromId||item.fromUserId}}</view>
|
||
|
|
<view class="msg-content">{{item.revoked?'消息已撤回':item.content}}</view>
|
||
|
|
<view class="msg-meta">
|
||
|
|
<text class="tag">{{item.status}}</text>
|
||
|
|
<text class="time">{{item.createdAt}}</text>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</scroll-view>
|
||
|
|
|
||
|
|
<view class="input-area">
|
||
|
|
<input class="msg-input" placeholder="输入消息" value="{{inputText}}" bindinput="onInput" confirm-type="send" bindconfirm="sendText" />
|
||
|
|
<button class="send-btn" type="primary" size="mini" bindtap="sendText">发送</button>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
|
||
|
|
<view wx:else class="empty-chat">选择一个会话开始聊天</view>
|
||
|
|
</view>
|
