update post page

1.add setting the current tag by clicking on the trending tags 2.add showing current tag on the post page
Cha0s0000 · Apr 16, 2018 · ac3a172 · ac3a172
1 parent 510a1f3
commit ac3a172
Show file tree

Hide file tree

Showing 3 changed files with 33 additions and 1 deletion.
diff --git a/pages/post/post.js b/pages/post/post.js
@@ -26,6 +26,10 @@ Page({
     this.setData({curTag:tag});
     console.log("current tag is ");
     console.log(tag);
+    if(!tag){
+      tag = "All";
+    }
+    this.setData({ open: false, currentTag: tag})
     this.getTrendingPosts();
   },
 
@@ -640,6 +644,14 @@ Page({
     wx.navigateTo({
       url: '../search/search'
     })
+  },
+  clickTags:function(e){
+    var clickTag = e.currentTarget.dataset.tag;
+    console.log("clickTag");
+    console.log(clickTag);
+    app.globalData.tag = clickTag;
+    this.onLoad();
+    this.setData({ open: false })
   }
 })
 
diff --git a/pages/post/post.wxml b/pages/post/post.wxml
@@ -17,6 +17,7 @@
 
           </block>
         </scroll-view>
+        <view class="currentTag">{{currentTag}}</view>
         <image bindtap='searchTags' class="searchIcon" src="../../images/icon/search.png"></image>
     </view>
     <view class="content {{open ? 'page-move' : ''}}">
@@ -63,6 +64,7 @@
   <view class="tags-title">Trending tags:</view>
   <view class="tags">
     <view  wx:for="{{tagsList}}" wx:for-item="tag" wx:key="tag">
+      <view class="tag" bindtap="clickTags" data-tag="{{tag.tag}}"> 
         <text decode="true" class="tag-text">&nbsp;{{tag.tag}}&nbsp;</text>
       </view>
     </view>

diff --git a/pages/post/post.wxss b/pages/post/post.wxss
@@ -11,6 +11,7 @@
     background-color:azure;
     font-size: 30rpx;
     display: flex;
+    flex-direction: row;
     align-items: center;
     height: 80rpx;
     position: fixed;
@@ -31,7 +32,7 @@
   right:100rpx;
 }
 .header__item{
-    padding: 14rpx;
+    padding: 10rpx;
     display: inline-block;
 }
 .active{
@@ -252,4 +253,21 @@ swiper,swiper image {
   width: 50rpx;
   height: 50rpx;
   vertical-align: cernter;
+}
+.currentTag{
+  position: absolute;
+  left:350rpx;
+  display:block;
+  text-align: center;
+  margin-left: 20px;
+  margin-right: 20px;
+  border-width: medium;
+  border-style: solid;
+  border-color: gray;
+  border-top-left-radius: 30rpx;
+  border-top-right-radius: 30rpx;
+  border-bottom-left-radius: 30rpx;
+  border-bottom-right-radius: 30rpx;
+  justify-content:center;
+
 }