完善沸点页

kaodigua · Sep 25, 2018 · c86c86f · c86c86f
1 parent 85bfd2d
commit c86c86f
Show file tree

Hide file tree

Showing 2 changed files with 47 additions and 3 deletions.
diff --git a/components/feidianItem/feidianItemTop/feidianItemTop.wxml b/components/feidianItem/feidianItemTop/feidianItemTop.wxml
@@ -17,6 +17,13 @@
   </view>
 </view>
 <text decode class='content {{intro ? "intro" : ""}}' data-id='{{item.objectId}}' catchtap='toFeidianDetail'>{{item.content}}</text>
+<view class='topic' wx:if='{{item.urlTitle || item.url}}'>
+  <view class='desc'>
+    <view>{{item.urlTitle}}</view>
+    <view class='url'>{{item.url}}</view>
+  </view>
+  <image wx:if='{{item.urlPic}}' src='{{item.urlPic}}' mode='aspectFill'></image>
+</view>
 <view class='pictures' wx:if='{{item.pictures && item.pictures.length}}'>
   <!-- 大于等于两张图片 -->
   <view class='picture' style='width:33.33%;' wx:key='{{index}}' wx:for='{{item.pictures}}' wx:for-item='i' wx:if='{{item.pictures.length >= 2}}'>
@@ -26,4 +33,5 @@
   <view class='picture' style='width:80%' wx:if='{{item.pictures.length === 1}}'>
     <image mode='widthFix' src='{{item.pictures[0]}}'></image>
   </view>
-</view>
+</view>
+<view wx:if='{{item.topic && item.topic.title}}' class='tag'>{{item.topic.title}}</view>
diff --git a/components/feidianItem/feidianItemTop/feidianItemTop.wxss b/components/feidianItem/feidianItemTop/feidianItemTop.wxss
@@ -32,8 +32,7 @@
 }
 .content {
   display: block;
-  padding: 20rpx 30rpx;
-  color: #666;
+  margin: 20rpx 30rpx;
   word-break: break-all;
 }
 .content.intro {
@@ -53,4 +52,41 @@
   width: 100%;
   border: 1px solid #efefef;
   display: block;
+}
+.topic {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  margin: 0 30rpx 20rpx;
+  padding: 20rpx 30rpx;
+  background: #F4F6F9;
+  border-radius: 4rpx;
+}
+.topic .desc {
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+  justify-content: space-between;
+  height: 100rpx;
+}
+.topic .url {
+  font-size: 22rpx;
+  color: #999;
+}
+.topic image {
+  width: 100rpx;
+  height: 100rpx;
+  flex-shrink: 0;
+}
+.tag {
+  font-size: 22rpx;
+  margin: 0 30rpx 20rpx;
+  padding: 0 20rpx;
+  display: inline-block;
+  height: 36rpx;
+  line-height: 36rpx;
+  text-align: center;
+  color: #3281ff;
+  border: 1rpx solid #3281ff;
+  border-radius: 18rpx;
 }