首页：拼团、两张图、四张图的楼层开发 — review by 黄敬囿

 Component({
   properties: {
-    activityList: {
-      type: Array,
-      value: []
+    data: {
+      type: null,
     }
   },
   data: {

   
  <!-- 首页最新活动 -->
   <view class="activityContainer">
-    <block tt:for="{{activityList}}" tt:key="{{index}}">
+    <block tt:for="{{data.data}}" tt:key="{{index}}">
       <view class="activity" bindtap="jumpByRule" 
       data-jump_rule="{{item.url}}" data-url="{{item.url}}" 
       data-index="{{index}}"data-f_id="{{f_id}}" 

+Component({
+  properties: {
+    data: {
+      type: null
+    }
+  },
+  data: {
+    
+  },
+  methods: {
+    groupItemTapped() {
+      this.triggerEvent('jumpByRule');
+    }
+  }
+})
\ No newline at end of file

+{
+  "component": true
+}
\ No newline at end of file

+<!-- 首页 横向拼团 -->
+<scroll-view class="activity-container-footer" scroll-x="true">
+  <block wx:for="{{data}}" wx:key="{{index}}" wx:for-item="item">
+    <view class="group-product-item"
+          style='margin-right:{{index == data.length - 1?30:0}}rpx'
+          bindtap="groupItemTapped" 
+          data-skn="{{item.productSkn}}"
+          data-activity_id="{{item.activityId}}">
+      <image src="{{item.defaultImages}}" class="group-product-image"></image>
+      <view class="group-product-name">{{item.brandName}}</view>
+      <view class='group-product-price-container'>        
+        <view class='group-product-price'>{{item.formatCollagePrice}}</view>
+        <view class='group-product-market-price'>{{item.marketPrice}}</view>
+      </view>
+      <view class='group-product-joinnum'>{{item.collagedPersonNum}}人已拼</view>
+    </view>
+  </block>
+</scroll-view>
\ No newline at end of file

+.activity-container-footer {
+  white-space: nowrap;
+}
+.group-product-item{
+  width: 188rpx;
+  height: wrap;
+  display: inline-block;
+  margin-left: 30rpx;
+  padding-bottom: 20rpx;
+  padding-top: 20rpx;
+}
+.group-product-image{
+  width: 100%;
+  height: 250rpx;
+}
+.group-product-name{
+  font-family: PingFang-SC-Medium;
+  font-size: 24rpx;
+  color: #444444;
+  letter-spacing: 0;
+  text-align: center;
+  margin-top: 16rpx;
+  font-weight: bold;
+  overflow: hidden;
+  text-overflow:ellipsis;
+  white-space: nowrap;
+  width: 100%
+}
+.group-product-price-container{
+  widows: wrap;
+  height: 28rpx;
+  display: flex;
+  /* flex-direction: row; */
+  align-items: center;
+  justify-content: center;
+  margin-top: 16rpx;
+}
+.group-product-price{
+  font-family: PingFang-SC-Medium;
+  font-size: 24rpx;
+  color: #D0021B;
+  letter-spacing: 0;
+  font-weight: bold
+}
+.group-product-market-price{
+  font-family: PingFang-SC-Medium;
+  font-size: 18rpx;
+  color: #B0B0B0;
+  letter-spacing: 0;
+  margin-left: 10rpx;
+  text-decoration: line-through
+}
+.group-product-joinnum{
+  font-family: PingFang-SC-Medium;
+  font-size: 9px;
+  color: #B0B0B0;
+  letter-spacing: 0;
+  margin-top: 16rpx;
+  text-align: center;
+  width: 100%;
+}
\ No newline at end of file

+Component({
+  properties: {
+    data: {
+      type: null,
+    }
+  },
+  data: {
+    
+  },
+  methods: {
+    
+  }
+})
\ No newline at end of file

+{
+  "component": true
+}
\ No newline at end of file

+  
+ <!-- 首页 两图 -->
+<view class='twoImageContainer' style='height:{{345*data.ratio}}rpx;margin-top:{{data.title&&data.title.length>0?30:0}}rpx'>
+  <block wx:for="{{data.data.list}}" wx:key="{{index}}">
+    <image style='flex:1;height:100%;' src="{{item.src}}"  data-url="{{item.url}}" data-src="{{item.src}}" data-title="{{item.title}}" data-jump_rule="{{item.url}}" bindtap="jumpByRule" data-f_id="{{f_id}}" data-f_index='{{f_index}}' data-f_inindex='{{index}}' data-f_name='{{f_name}}' data-f_name='{{f_name}}'></image>
+  </block>
+</view>
\ No newline at end of file

+.twoImageContainer{
+  width: 690rpx;
+  /* height: 200rpx; */
+  margin-left: 30rpx;
+  margin-right:30rpx;
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+}
\ No newline at end of file

@@ -4,13 +4,13 @@ export default {
     payment_code: '45',
     domains: {
         // production
-        api: 'https://api.yoho.cn',
+        // api: 'https://api.yoho.cn',
 
         // gray
         // api: 'http://apigray.yoho.cn',
 
         // test
-        // api: 'http://api-test3.dev.yohocorp.com',
+        api: 'http://api-test3.dev.yohocorp.com',
 
         yasApi: 'https://analysis.yohobuy.com/yas_mobile',
         app_report_host: 'https://app.yoho.cn/collect/v3',

@@ -4,8 +4,10 @@
     "home-banner": "../../components/home/home-banner/home-banner",
     "home-hot-category": "../../components/home/home-hot-category/home-hot-category",
     "home-brand": "../../components/home/home-brand/home-brand",
-    "home-new-activity": "../../components/home/home-new-activity/home-new-activity",
+    "home-four-images": "../../components/home/home-four-images/home-four-images",
+    "home-two-images": "../../components/home/home-two-images/home-two-images",
     "home-single-image": "../../components/home/home-single-image/home-single-image",
+    "home-group-booking": "../../components/home/home-group-booking/home-group-booking",
     "home-hor-product-list": "../../components/home/home-hor-product-list/home-hor-product-list",
     "productCell": "../../components/productList/productCell"
   }

@@ -58,16 +58,16 @@
       <home-banner data="{{data:item.data,f_id:item.template_id,f_index:index,f_name:item.template_name}}" bindjumpByRule="jumpByRuleEvent"></home-banner>
     </block>
 
-    <!-- <block tt:if="{{item.template_name == 'image_list' && item.data.list.length == 4}}">
-      <template is='fourImage' data="{{data:item.data,f_id:item.template_id,f_index:index,f_name:item.template_name}}"/>
-    </block> -->
+    <block tt:elif="{{item.template_name=='image_list' && item.data.list.length == 4}}">
+      <home-four-images data="{{data:item.data.list,f_id:item.template_id,f_index:index,f_name:item.template_name}}" bindjumpByRule="jumpByRuleEvent"></home-four-images>
+    </block>
         
-    <!-- <block tt:if="{{item.template_name == 'twoPicture'}}">
+    <block tt:elif="{{item.template_name == 'twoPicture'}}">
       <block tt:if="{{item.title}}">
         <template is='tipTitle' data="{{desc:item.title,more_url:item.moreUrl,no_line:false}}"/>
       </block>
-      <template is='twoImage' data="{{data:item.data,f_id:item.template_id,f_index:index,f_name:item.template_name,ratio:item.ratio,title:item.title}}"/>
-    </block> -->
+      <home-two-images data="{{data:item.data,f_id:item.template_id,f_index:index,f_name:item.template_name,ratio:item.ratio,title:item.title}}" bindjumpByRule="jumpByRuleEvent"></home-two-images>
+    </block>
 
     <block tt:elif="{{item.template_name=='newSingleImage'}}">
       <block tt:if="{{item.title}}">
@@ -96,41 +96,23 @@
       <view tt:if="{{!item.title}}" style='width:100%;height:16rpx;background-color:white'/><!--兼容空白 后期需优化调整-->
     </block>
 
+    <!--拼团购商品列表-->
+    <block tt:elif="{{item.template_name=='collageBuyPrdList'}}">
+      <home-group-booking data="{{item.prdList}}" bindjumpByRule="jumpByRuleEvent"></home-group-booking>
+    </block>
+
     <block tt:elif="{{item.template_name=='newProductListFloor'}}">
       <home-hor-product-list data="{{item.data}}" bindjumpByRule="jumpByRuleEvent"></home-hor-product-list>
     </block>
-      
-    <!--拼团购商品列表-->
-    <!-- <block tt:elif="{{item.template_name=='collageBuyPrdList'}}">
-      
-    </block> -->
-
+    
     <block tt:elif="{{item.template_name=='popularListFloor'}}">
       <home-hor-product-list data="{{item.data}}" bindjumpByRule="jumpByRuleEvent"></home-hor-product-list>
     </block>
-
-    <!-- <block tt:elif="{{item.template_name=='popularListFloor'}}">    
-      <scroll-view class="activity-container-footer" scroll-x="true">
-        <block tt:for="{{item.data.list}}" tt:key="{{index}}" tt:for-item="item">
-          <view class="activity-item" bindtap="activityItemTapped" data-skn="{{item.product_skn}}"
-          data-f_id="{{item.template_id}}" data-f_index='{{item.index}}' data-f_inindex='{{index}}' data-f_name='newProductListFloor'>
-            <image src="{{item.default_images}}" class="activity-item-img"></image>
-            <view class="activity-item-price">{{item.shop_name}}</view>
-          </view>
-        </block>
-      </scroll-view>
-    </block> -->
   
-
-    
-    <!-- <template is='tipTitle' data="{{desc:'最新活动'}}"/>
-    <home-new-activity activity-list="{{activityList}}" 
-    bindjumpByRule="jumpByRuleEvent"></home-new-activity> -->
-    
   </block>
 
   <!-- 商品推荐 -->
-  <block tt:elif="{{newChannels[selectedChannel]['recommend']['data'].length > 0}}">
+  <block tt:if="{{newChannels[selectedChannel]['recommend']['data'].length > 0}}">
     <template is='tipTitle' data="{{desc:'猜你喜欢'}}"/>
     <view class="product-list">
       <block tt:for="{{newChannels[selectedChannel]['recommend']['data']}}" tt:for-item="product" tt:key="{{index}}">