Browse Source

开发联调优化聊天页面

bayi 2 years ago
parent
commit
bb5247d1b5
5 changed files with 40 additions and 32 deletions
  1. 35 26
      pages/chat/index.js
  2. 1 2
      pages/chat/index.json
  3. 2 2
      pages/chat/index.less
  4. 1 0
      pages/chat/index.wxml
  5. 1 2
      pages/chat/index.wxss

+ 35 - 26
pages/chat/index.js

@@ -21,6 +21,7 @@ Page({
     scrollTop: 0,
     triggered: false,
     isIos: app.globalData.isIOS,
+    navBarHeight: app.globalData.navBarHeight,
     uid: wx.getStorageSync('uid')
   },
   onLoad(options) {
@@ -38,36 +39,41 @@ Page({
       },
     })
     this.storeBindings.updateStoreBindings()
-    this.getMsgDet()
+    this.getMsgDet().then(() => {
+      this.setData({
+        scrollTop: 10000
+      })
+    })
     this.getNewMsgDet()
     this.interval = setInterval(() => {
       this.getNewMsgDet()
     }, 5000)
   },
-  async getMsgDet() {
-    let pageNo = this.data.pageNo
-    if (this.data.totalNo < pageNo) {
-      return this.setData({
+  getMsgDet() {
+    return new Promise(async (reslove) => {
+      let pageNo = this.data.pageNo
+      if (this.data.totalNo < pageNo) {
+        return this.setData({
+          triggered: false,
+        })
+      }
+      let data = await getMsgDet({
+        senderUid: this.data.targetUid,
+        pageNo,
+        pageSize: 10
+      })
+      let {
+        list,
+        totalNo
+      } = data
+      this.setData({
+        list: [...list, ...this.data.list],
+        totalNo,
+        pageNo: totalNo >= pageNo ? ++pageNo : pageNo,
         triggered: false,
       })
-    }
-    let data = await getMsgDet({
-      senderUid: this.data.targetUid,
-      pageNo,
-      pageSize: 10
+      reslove()
     })
-
-    let {
-      list,
-      totalNo
-    } = data
-    this.setData({
-      list: [...list, ...this.data.list],
-      totalNo,
-      pageNo: totalNo >= pageNo ? ++pageNo : pageNo,
-      triggered: false,
-    })
-    console.log('就列表', data);
   },
   async getNewMsgDet() {
     let res = await getNewMsgDet({
@@ -76,7 +82,6 @@ Page({
     let newList = [...this.data.list, ...res]
     this.setData({
       list: newList,
-      scrollTop: 100000
     })
   },
   async sendReply() {
@@ -90,7 +95,7 @@ Page({
     })
     this.setData({
       value: '',
-      scrollTop: 3000
+      scrollTop: this.data.list.length * 1000
     })
     this.getNewMsgDet()
   },
@@ -100,8 +105,6 @@ Page({
       sizeType: ['compressed'], // 压缩图片
       sourceType: ['album', 'camera'], // 来源:相册或相机
       success: (res) => {
-        // 将选择的图片上传到服务器
-        console.log(res);
         this.uploadImage(res.tempFilePaths[0]);
       }
     })
@@ -121,6 +124,9 @@ Page({
           receiverUid: this.data.targetUid
         })
         this.getNewMsgDet()
+        this.setData({
+          scrollTop: this.data.list.length * 1000
+        })
       }
     })
   },
@@ -136,4 +142,7 @@ Page({
       url: `/pages/personal/index?uid=${currentTarget.dataset.uid}&type=user`,
     })
   },
+  onUnload() {
+    clearInterval(this.interval)
+  }
 })

+ 1 - 2
pages/chat/index.json

@@ -1,4 +1,3 @@
 {
-  "usingComponents": {},
-  "enablePullDownRefresh": true
+  "usingComponents": {}
 }

+ 2 - 2
pages/chat/index.less

@@ -1,10 +1,9 @@
 .chat {
-  min-height: 100vh;
   background-color: white;
 
   .content {
     height: 100vh;
-    padding: 0rpx 30rpx 150rpx;
+    padding: 0rpx 30rpx;
     box-sizing: border-box;
 
     .base {
@@ -13,6 +12,7 @@
       justify-content: space-between;
       margin-bottom: 42rpx;
       margin-top: 20rpx;
+
       .avatar {
         width: 80rpx;
         height: 80rpx;

+ 1 - 0
pages/chat/index.wxml

@@ -13,6 +13,7 @@
         <image src="{{userInfo.avatar}}" class="avatar" bindtap="jumpUserInfo" data-uid='{{item.senderUid}}' />
       </view>
     </block>
+    <view style="height: 240rpx;"></view>
   </scroll-view>
   <view class="inputBox {{isIos?'iosPadding':''}}">
     <input class="input" bindinput="bindKeyInput" value="{{value}}" placeholder="我有话说..." confirm-type='sendReply'

+ 1 - 2
pages/chat/index.wxss

@@ -1,10 +1,9 @@
 .chat {
-  min-height: 100vh;
   background-color: white;
 }
 .chat .content {
   height: 100vh;
-  padding: 0rpx 30rpx 150rpx;
+  padding: 0rpx 30rpx;
   box-sizing: border-box;
 }
 .chat .content .base {