fix[litemall-wx]: 评论列表不能正确显示

linlinjava · Nov 15, 2019 · 7da365d · 7da365d
1 parent bdd497e
commit 7da365d
Show file tree

Hide file tree

Showing 3 changed files with 69 additions and 19 deletions.
diff --git a/litemall-wx/pages/topicComment/topicComment.js b/litemall-wx/pages/topicComment/topicComment.js
@@ -45,15 +45,15 @@ Page({
 
         if (that.data.showType == 0) {
           that.setData({
-            allCommentList: that.data.allCommentList.concat(res.data.data),
-            allPage: res.data.currentPage,
-            comments: that.data.allCommentList.concat(res.data.data)
+            allCommentList: that.data.allCommentList.concat(res.data.list),
+            allPage: res.data.page,
+            comments: that.data.allCommentList.concat(res.data.list)
           });
         } else {
           that.setData({
-            picCommentList: that.data.picCommentList.concat(res.data.data),
-            picPage: res.data.currentPage,
-            comments: that.data.picCommentList.concat(res.data.data)
+            picCommentList: that.data.picCommentList.concat(res.data.list),
+            picPage: res.data.page,
+            comments: that.data.picCommentList.concat(res.data.list)
           });
         }
       }
@@ -84,36 +84,41 @@ Page({
     // 页面关闭
 
   },
-  switchTab: function() {
-    this.setData({
-      showType: this.data.showType == 1 ? 0 : 1
-    });
-
+  switchTab: function () {
+    let that = this;
+    if (that.data.showType == 0) {
+      that.setData({
+        allCommentList: [],
+        allPage: 1,
+        comments: [],
+        showType: 1
+      });
+    } else {
+      that.setData({
+        picCommentList: [],
+        picPage: 1,
+        comments: [],
+        showType: 0
+      });
+    }
     this.getCommentList();
   },
   onReachBottom: function() {
-    console.log('onPullDownRefresh');
     if (this.data.showType == 0) {
-
       if (this.data.allCount / this.data.limit < this.data.allPage) {
         return false;
       }
-
       this.setData({
         allPage: this.data.allPage + 1
       });
     } else {
       if (this.data.hasPicCount / this.data.limit < this.data.picPage) {
         return false;
       }
-
       this.setData({
         picPage: this.data.picPage + 1
       });
     }
-
-
-
     this.getCommentList();
   }
 })
diff --git a/litemall-wx/pages/topicComment/topicComment.wxml b/litemall-wx/pages/topicComment/topicComment.wxml
@@ -1,4 +1,12 @@
 <view class="comments">
+  <view class="h">
+    <view class="item {{ showType == 0 ? 'active' : ''}}" bindtap="switchTab">
+      <view class="txt">全部({{allCount}})</view>
+    </view>
+    <view class="item {{ showType == 0 ? '' : 'active'}}" bindtap="switchTab">
+      <view class="txt">有图({{hasPicCount}})</view>
+    </view>
+  </view>
   <view class="b">
     <view class="item" wx:for="{{comments}}" wx:key="id">
       <view class="info">
@@ -10,7 +18,7 @@
       </view>
       <view class="comment">{{item.content}}</view>
       <view class="imgs" wx:if="{{item.picList.length > 0}}">
-        <image class="img" wx:for="{{item.picList}}" wx:key="id" wx:for-item="pitem" src="{{pitem.picUrl}}"></image>
+        <image class="img" wx:for="{{item.picList}}" wx:key="*this" wx:for-item="pitem" src="{{pitem}}"></image>
       </view>
     </view>
 

diff --git a/litemall-wx/pages/topicComment/topicComment.wxss b/litemall-wx/pages/topicComment/topicComment.wxss
@@ -6,7 +6,44 @@
   margin: 20rpx 0;
 }
 
+
+.comments .h {
+  position: fixed;
+  left: 0;
+  top: 0;
+  z-index: 1000;
+  width: 100%;
+  display: flex;
+  background: #fff;
+  height: 84rpx;
+  border-bottom: 1px solid rgba(0, 0, 0, 0.15);
+}
+
+.comments .h .item {
+  display: inline-block;
+  height: 82rpx;
+  width: 50%;
+  padding: 0 15rpx;
+  text-align: center;
+}
+
+.comments .h .item .txt {
+  display: inline-block;
+  height: 82rpx;
+  padding: 0 20rpx;
+  line-height: 82rpx;
+  color: #333;
+  font-size: 30rpx;
+  width: 170rpx;
+}
+
+.comments .h .item.active .txt {
+  color: #ab2b2b;
+  border-bottom: 4rpx solid #ab2b2b;
+}
+
 .comments .b {
+  margin-top: 85rpx;
   height: auto;
   width: 720rpx;
 }