直播

pages/liveStreaming/index.js

@@ -2,6 +2,7 @@ import {
   ApiModel
 } from "../../utils/api";
 const _Http = new ApiModel;
+let rep = null;
 Page({
   /**
    * 页面的初始数据
@@ -27,6 +28,8 @@ Page({
     listRowIndex: -1, //列表选中项
     CheckTheType: '当前直播', //查看类型
     onlineNumber: 0, //实时观看人数
+    oldDialogue: [], //老直播聊天数据
+    newDialogue: [], //新直播聊天数据
   },
 
   /**
@@ -46,7 +49,6 @@ Page({
         title: '当前没有开播记录',
         icon: "none"
       })
-      return
     }
     this.setData({
       CheckTheType: detail
@@ -54,39 +56,76 @@ Page({
   },
   /* 实时 */
   realTime() {
-    const that = this,
-      token = wx.getStorageSync('userData').token,
-      channelid = this.data.accountMsg.channelid;
     /* 获取当前用户列表 */
     this.getRealTimeViewerList();
     //获取聊天
-    /* setInterval(() => {
-      _Http.basic({
-        "accesstoken": token,
-        "classname": "customer.live.live",
-        "method": "getRealTimeMessageList",
-        "content": {
-          "channelid": channelid
-        }
-      }, false).then(res => {
-        console.log("聊天", res)
-      })
-    }, 2000); */
+    this.getRealTimeMessageList();
     //实时观看人数
+    this.getRealTimeViewers();
+    rep = setInterval(() => {
+      /* 获取当前用户列表 */
+      this.getRealTimeViewerList();
+      //获取聊天
+      this.getRealTimeMessageList();
+      //实时观看人数
+      this.getRealTimeViewers();
+    }, 3000)
+  },
+  //实时观看人数
+  getRealTimeViewers() {
     _Http.basic({
-      "accesstoken": token,
+      "accesstoken": wx.getStorageSync('userData').token,
       "classname": "customer.live.live",
       "method": "getRealTimeViewers",
       "content": {
-        "channelid": channelid
+        "channelid": this.data.accountMsg.channelid
       }
-    }).then(res => {
+    }, false).then(res => {
       if (res.msg != '成功') return;
       this.setData({
         onlineNumber: res.data.count
       })
     })
   },
+  //获取聊天
+  getRealTimeMessageList() {
+    _Http.basic({
+      "accesstoken": wx.getStorageSync('userData').token,
+      "classname": "customer.live.live",
+      "method": "getRealTimeMessageList",
+      "content": {
+        "pageNumber": 1,
+        "pageSize": 999,
+        "channelid": this.data.accountMsg.channelid
+      }
+    }, false).then(res => {
+      if (this.data.oldDialogue.length == 0) {
+        for (let i = 0; i < res.data.length; i++) {
+          let data = res.data[i].datetime.split(" ");
+          res.data[i].datetime = data[1]
+        }
+        this.setData({
+          oldDialogue: res.data
+        })
+      } else {
+        let oldDialogue = this.data.oldDialogue,
+          newDialogue = res.data;
+        if (!Object.is(JSON.stringify(oldDialogue), JSON.stringify(newDialogue))) {
+          let data = JSON.stringify(oldDialogue)
+          for (let i = 0; i < newDialogue.length; i++) {
+            if (!data.includes(newDialogue[i].id)) {
+              let data = newDialogue[i].datetime.split(" ");
+              newDialogue[i].datetime = data[1]
+              oldDialogue.unshift(newDialogue[i]);
+            }
+          }
+          this.setData({
+            oldDialogue
+          })
+        }
+      }
+    })
+  },
   /* 获取当前用户列表 */
   getRealTimeViewerList() {
     _Http.basic({
@@ -99,9 +138,8 @@ Page({
         "channelid": this.data.accountMsg.channelid
       }
     }, false).then(res => {
-      console.log(res)
       if (res.msg != '成功') {
-        if (res.data.liveUserList.length <= 0) return wx.showToast({
+        if (this.data.liveUserList.length <= 0) return wx.showToast({
           title: res.data,
           icon: "none"
         });
@@ -222,7 +260,6 @@ Page({
     this.viewDetails(e.detail.value);
   },
   viewDetails(index) {
-    console.log(index, this.data.liveSessionList[index])
     const sessionid = this.data.liveSessionList[index].sessionid;
     this.setData({
       showStartTime: this.data.liveSessionList[index].starttime,
@@ -385,7 +422,9 @@ Page({
   /**
    * 生命周期函数--监听页面卸载
    */
-  onUnload: function () {},
+  onUnload: function () {
+    clearInterval(rep)
+  },
 
   /**
    * 页面相关事件处理函数--监听用户下拉动作

pages/liveStreaming/index.wxml

@@ -57,11 +57,13 @@
         <!-- 实时聊天信息 -->
         <view class="live-chat" hidden="{{CheckTheType!='当前直播'}}">
             <view class="live-chat-title">观看人数：{{onlineNumber}}</view>
-            <view class="live-chat-mag" wx:for="{{3}}">
-                <view class="live-chat-mag-userName">用户名：</view>
-                <view class="live-chat-mag-text">找是打发斯蒂芬找是打发斯蒂芬找是打发斯蒂芬找是打发斯蒂芬找是打发斯蒂芬找是打发斯蒂芬找是打发斯蒂芬找是打发斯蒂芬</view>
-                <view class="live-chat-mag-time">10:52</view>
-            </view>
+            <scroll-view scroll-y class="live-chat-concent">
+                <view class="live-chat-mag" wx:for="{{oldDialogue}}">
+                    <view class="live-chat-mag-userName">{{item.nickname}}：</view>
+                    <view class="live-chat-mag-text">{{item.content}}</view>
+                    <view class="live-chat-mag-time">{{item.datetime}}</view>
+                </view>
+            </scroll-view>
         </view>
         <!-- 数据宫格 -->
         <view hidden="{{CheckTheType!='历史直播'}}" class="live-chat" style="height: 274rpx;" hidden="{{CheckTheType!='历史直播'}}">

pages/liveStreaming/index.wxss

@@ -144,6 +144,8 @@
 
 /* 在线聊天 */
 .live-chat {
+    display: flex;
+    flex-direction: column;
     height: 450rpx;
     width: 662rpx;
     margin: 0 auto;
@@ -166,6 +168,11 @@
     padding-left: 20rpx;
 }
 
+.live-chat-concent {
+    width: 100%;
+    height: 386rpx;
+}
+
 .exhibition {
     float: left;
     margin-top: 10rpx;