活动秒杀楼层

@@ -10,7 +10,7 @@
         </div>
     </div>
 
-    <div class="out-product-list">
+    <div class="out-product-list less-than-3">
         <div class="product-list">
             <div class="product">
                 <a href="">
@@ -19,12 +19,12 @@
                         <div class="product-brand">MADNESS</div>
                     </div>
                     <div class="product-info">
-                        <div class="seckill-status" style="background: url()">
+                        <div class="seckill-status status-0">
                             <div class="price">
                                 <span class="seckill-price">9元</span>
                                 <span class="market-price">¥199</span>
                             </div>
-                            <span class="status">立即抢</span>
+                            <div class="status-type">立即抢</div>
                         </div>
                     </div>
                 </a>            
@@ -41,7 +41,7 @@
                                 <span class="seckill-price">9元</span>
                                 <span class="market-price">¥199</span>
                             </div>
-                            <span class="status">立即抢</span>
+                            <div class="status-type">立即抢</div>
                         </div>
                     </div>
                 </a>            
@@ -53,17 +53,17 @@
                         <div class="product-brand">MADNESS</div>
                     </div>
                     <div class="product-info">
-                        <div class="seckill-status" style="background: url()">
+                        <div class="seckill-status status-0">
                             <div class="price">
                                 <span class="seckill-price">9元</span>
                                 <span class="market-price">¥199</span>
                             </div>
-                            <span class="status">立即抢</span>
+                            <div class="status-type">立即抢</div>
                         </div>
                     </div>
                 </a>            
             </div>
-            <div class="product">
+            {{!-- <div class="product">
                 <a href="">
                     <div class="img-box">
                         <img src="//img13.static.yhbimg.com/goodsimg/2011/07/28/09/02489383d3937a4ee4706ab7f516482e7b.jpg?imageMogr2/thumbnail/160x216/position/center/quality/85/format/webp" alt="">
@@ -75,12 +75,11 @@
                                 <span class="seckill-price">9元</span>
                                 <span class="market-price">¥199</span>
                             </div>
-                            <span class="status">立即抢</span>
+                            <div class="status-type">立即抢</div>
                         </div>
                     </div>
                 </a>            
-            </div>
+            </div> --}}
         </div>
     </div>
-    
 </div>
\ No newline at end of file

@@ -700,6 +700,26 @@ function miniProgramHandleInit() {
     }
 }
 
+function loadSeckillList() {
+    $.ajax({
+        url: '/product/seckill/list'
+    }).done(function(result) {
+        console.log(result);
+    }).error(function() {
+
+    }).always(function() {
+
+    });
+}
+
+function seckillInit() {
+    loadSeckillList();
+
+    $(document).on('click', '.seckill-tab .tab-item', function() {
+        $(this).addClass('actived').siblings().removeClass('actived');
+    });
+}
+
 $(function() {
     if ($('.over').length) {
         // 过期／删除 状态的 活动
@@ -758,6 +778,9 @@ $(function() {
     // 点赞楼层
     likedActivityInit();
 
+    // 秒杀
+    seckillInit();
+
     // 小程序相关处理
     if (!window.WeixinJSBridge || !window.WeixinJSBridge.invoke) {
         document.addEventListener('WeixinJSBridgeReady', miniProgramHandleInit, false);

@@ -5,7 +5,7 @@
         width: 100%;
         overflow-x: scroll;
         white-space: nowrap;
-        height: 48px;
+        height: 58px;
 
         .tab-item {
             background: #ef8e88;
@@ -47,10 +47,10 @@
     .out-product-list {
         height: 248px;
         overflow: hidden;
+        margin-top: 15px;
     }
 
     .product-list {
-        margin-top: 15px;
         overflow-x: scroll;
         white-space: nowrap;
         height: 258px;
@@ -89,11 +89,20 @@
             .seckill-status {
                 height: 28px;
                 color: #fff;
+                background-size: contain;
+                background-repeat: no-repeat;
+                padding-left: 7px;
+                box-sizing: border-box;
+            }
+
+            .status-0 {
+                background-image: url("img/activity/seckill/seckill-0.png");
             }
 
             .price {
-                display: inline-block;
                 font-size: 12px;
+                float: left;
+                width: 50%;
             }
 
             .market-price {
@@ -101,6 +110,40 @@
                 transform: scale(0.9);
                 display: inline-block;
             }
+
+            .status-type {
+                width: 50%;
+                text-align: center;
+                display: inline-block;
+                border: none;
+            }
+        }
+    }
+
+    .less-than-3 {
+        height: 280px;
+
+        .product-list {
+            height: 280px;
+        }
+
+        .product {
+            width: 192px;
+            margin-right: 7px;
+
+            &:last-child {
+                margin-right: 0;
+            }
+
+            .img-box {
+                width: 192px;
+                height: 244px;
+            }
+
+            .seckill-status {
+                height: 36px;
+                line-height: 36px;
+            }
         }
     }
 }