领券修改

@@ -2,13 +2,13 @@
  * Created by Administrator on 2016/4/13.
  */
 var $ = require('jquery');
-var $receive = $('.coupon-right-reBox');
-var $mask = $('.coupon-mask');
-var $message = $('.coupon-message');
-var $tooltip = $('.coupon-tooltip');
-var $right = $('.coupon-right-reBox');
+var $receive = $('.main-right-receive');
+var $mask = $('.floor-mask');
+var $message = $('.floor-message');
+var $tooltip = $('.floor-tooltip');
 
-$receive.on('touchend',function(){console.log('s');
+$receive.on('touchend',function(){
+    var curDom=$(this);
     $.ajax({
         url:'/coupon/receiveCoupon',
         dataType:'json',
@@ -17,8 +17,9 @@ $receive.on('touchend',function(){console.log('s');
                 var msg=data.msg;
                 var status=data.status;
                 if(!status){
+                    curDom.hide();
+                    curDom.next().show();
                     $tooltip.show();
-                    $right.css({"background":"url('http://static.dev.yohobuy.com/img/test/received.png')","background-repeat:":"no-repeat","background-size":"100%"});
                     setTimeout(function(){
                         $tooltip.hide();
                     },3000);
@@ -33,4 +34,10 @@ $receive.on('touchend',function(){console.log('s');
         },
         error:function(){}
     });
-});
\ No newline at end of file
+});
+
+$('.coupon-floor a').on('click', function () {
+    if($(this).attr('href').length <= 0) {
+        return false;
+    }
+})
\ No newline at end of file

 .coupon-floor {
     float: left;
 
-    .coupon-title {
+    .floor-title {
         background-color: #fff;
         text-align: center;
         height: 96rem/$pxConvertRem;
@@ -9,44 +9,41 @@
         font-size: 30rem / $pxConvertRem;
     }
 
-    .coupon-box {
+    .floor-main {
         height: 180rem /$pxConvertRem;
         width: 100%;
         background-size: 100%;
         background-repeat: no-repeat;
+        background-image: url('http://static.dev.yohobuy.com/img/test/coupon.png');
         float: left;
 
-        .coupon-left {
-                float: left;
-                width: 497rem/$pxConvertRem;
-                height: 180rem/$pxConvertRem;
-            }
+        .main-left {
+            float: left;
+            width: 497rem/$pxConvertRem;
+            height: 180rem/$pxConvertRem;
+        }
 
-        .coupon-right {
-                float: left;
-                width: 143rem/$pxConvertRem;
-                text-align: center;
-                height: 180rem/$pxConvertRem;
-                background-size: 100%;
-                background-repeat: no-repeat;
-               // background: url("http://static.dev.yohobuy.com/img/test/received.png");
+        .main-right-receive {
+            float: left;
+            width: 143rem/$pxConvertRem;
+            height: 180rem/$pxConvertRem;
+            background-size: 100%;
+            background-repeat: no-repeat;
+        }
 
-                .coupon-right-reBox {
-                    height: 100%;
-                    width: 100%;
-                    color:#fff;
-                }
+        .main-right-use {
+            @extend .main-right-receive;
+            background-image: url('http://static.dev.yohobuy.com/img/test/received.png');
+        }
 
-                .coupon-right-goBox {
-                    height: 100%;
-                    width: 100%;
-                    color:#fff;
-                }
-            }
+        .main-right-go {
+            @extend .main-right-receive;
+            background-image: url("http://static.dev.yohobuy.com/img/test/zero.png");
+        }
     }
 }
 
-.coupon-mask {
+.floor-mask {
     position: absolute;
     top: 0;
     left: 0;
@@ -57,7 +54,7 @@
     z-index: 9;
 }
 
-.coupon-message {
+.floor-message {
     position: fixed;
     top: 50%;
     left: 50%;
@@ -87,7 +84,7 @@
     }
 }
 
-.coupon-tooltip{
+.floor-tooltip{
     position: fixed;
     top: 50%;
     left: 50%;

 {{>layout/header}}
 {{# floor}}
     {{#if isCoupon}}
-    {{# list}}
+    {{#each list}}
         <div class="coupon-floor">
              {{#if title}}
-            <div class="coupon-title">{{title}}
+            <div class="floor-title">{{title}}
             </div>
             {{/if}}
-            <div class="coupon-box" style="background-image: url('http://static.dev.yohobuy.com/img/test/coupon.png')">
-                {{#if image.src}}
+            <div class="floor-main">
                 <a href="{{goShopping}}">
-                    <div class="coupon-left"></div>
+                    <div class="main-left"></div>
+                </a>
+                {{#if isGet}}
+                <div class="main-right-receive"></div>
+                <a href="{{goShopping}}" style="display: none">
+                    <div class="main-right-use"></div>
+                </a>
+                {{/if}}
+                {{#if isGeted}}
+                <a href="{{goShopping}}">
+                    <div class="main-right-use"></div>
+                </a>
+                {{/if}}
+                {{#if isZero}}
+                <a href="{{goShopping}}">
+                    <div class="main-right-go"></div>
                 </a>
-                {{^}}
-                <div class="coupon-left"></div>
                 {{/if}}
-                <div class="coupon-right">
-                    {{#if isGet}}
-                    <div class="coupon-right-reBox"></div>
-                    {{/if}}
-                    {{#if isGeted}}
-                    <a href="{{goShopping}}">
-                        <div class="coupon-right-goBox"></div>
-                    </a>
-                    {{/if}}
-                    {{#if isZero}}
-                    <a href="{{goShopping}}">
-                        <div style="height: 100%;width:100%" class="coupon-right-goBox"></div>
-                    </a>
-                    {{/if}}
-                </div>
             </div>
         </div>
         {{/ list}}
     {{/if}}
 {{/ floor}}
-<div class="coupon-mask"></div>
-<div class="coupon-message">
+<div class="floor-mask"></div>
+<div class="floor-message">
     <div class="coupon-message-content"></div>
     <div class="coupon-message-op">
         <a href="http://m.dev.yohobuy.com/coupon/floor">
@@ -44,7 +41,7 @@
         </a>
     </div>
 </div>
-<div class="coupon-tooltip">
+<div class="floor-tooltip">
     <div class="iconfont icon-box">&#xe648;</div>
     <div class="icon-msg">领取成功</div>
 </div>