邹方成
7ce96a57e5
- 添加下拉刷新功能并设置背景色 - 调整滚动加载阈值从20改为100 - 修改getMessages返回Promise以支持链式调用 - 在页面显示时立即获取最新消息 - 实现下拉刷新时获取最新消息并停止动画
51 lines
1.9 KiB
Plaintext
51 lines
1.9 KiB
Plaintext
<!-- pages/contact/index.wxml -->
|
|
<view class="chat-page">
|
|
<!-- 顶部蓝色栏 -->
|
|
<!-- <view class="header-bar">
|
|
<image class="header-avatar" src="{{serviceAvatar}}" />
|
|
<text class="header-title">租号客服</text>
|
|
</view> -->
|
|
|
|
<scroll-view class="messages" scroll-y="true" scroll-into-view="{{scrollToId}}" bindscroll="onScroll" bindscrolltolower="onScrollToLower" lower-threshold="100">
|
|
<block wx:for="{{messages}}" wx:key="id">
|
|
<!-- 时间分割线 -->
|
|
<block wx:if="{{item.showTime}}">
|
|
<view class="msg-time">{{item.timeStr}}</view>
|
|
</block>
|
|
<view id="{{item.id}}" class="message {{item.sender_id == userInfo.openid ? 'user' : 'service'}}">
|
|
<view class="avatar-wrap">
|
|
<image class="avatar" src="{{item.sender_id == userInfo.openid ? userAvatar : serviceAvatar}}" />
|
|
|
|
</view>
|
|
<view class="bubble-wrap">
|
|
<view class="bubble">
|
|
<block wx:if="{{item.msg_type == 1}}">
|
|
<text class="msg-text">{{item.content.messages}}</text>
|
|
</block>
|
|
<block wx:elif="{{item.msg_type == 2}}">
|
|
<image src="{{item.content.messages}}" bindtap="previewImage" data-src="{{item.content.messages}}" class="msg-image" mode="aspectFill" />
|
|
</block>
|
|
</view>
|
|
|
|
<view class="send-time">{{item.send_time}}</view>
|
|
</view>
|
|
</view>
|
|
</block>
|
|
</scroll-view>
|
|
|
|
<view class="input-area">
|
|
<image class="btn-image-img" src="/static/upload.png" bindtap="chooseImage" mode="aspectFit" />
|
|
<input class="input" placeholder="请输入内容" value="{{inputText}}" bindinput="onInput" confirm-type="send" bindconfirm="sendText" />
|
|
<button class="btn-send" bindtap="sendText">发送</button>
|
|
</view>
|
|
|
|
<!-- 静默登录中提示 -->
|
|
<block wx:if="{{showGetUser}}">
|
|
<view class="overlay">
|
|
<view class="popup">
|
|
<text class="popup-title">正在登录...</text>
|
|
<text class="popup-desc">请稍候，正在为您自动登录。</text>
|
|
</view>
|
|
</view>
|
|
</block>
|
|
</view> |