Authored by biao

详情页增加获取限购码

@@ -37,7 +37,8 @@ function getInstance() { @@ -37,7 +37,8 @@ function getInstance() {
37 return dialogTemplate; 37 return dialogTemplate;
38 } 38 }
39 39
40 -exports.showDialog = function(data, callback, callbackForLeft) { 40 +// fullWithBtn是供详情页获取限购码使用的特殊参数
  41 +exports.showDialog = function(data, callback, callbackForLeft, fullWithBtn) {
41 42
42 var dialogTemplate = getInstance(), 43 var dialogTemplate = getInstance(),
43 dialogStr = dialogTemplate(data), 44 dialogStr = dialogTemplate(data),
@@ -51,6 +52,8 @@ exports.showDialog = function(data, callback, callbackForLeft) { @@ -51,6 +52,8 @@ exports.showDialog = function(data, callback, callbackForLeft) {
51 52
52 $dialogBox = $('.dialog-box'); 53 $dialogBox = $('.dialog-box');
53 $dialogWrapper = $('.dialog-wrapper'); 54 $dialogWrapper = $('.dialog-wrapper');
  55 +
  56 +
54 dialogWrapperHammer = new Hammer(document.getElementById('dialog-wrapper')); 57 dialogWrapperHammer = new Hammer(document.getElementById('dialog-wrapper'));
55 58
56 // 显示 59 // 显示
@@ -62,6 +65,15 @@ exports.showDialog = function(data, callback, callbackForLeft) { @@ -62,6 +65,15 @@ exports.showDialog = function(data, callback, callbackForLeft) {
62 $dialogWrapper.fadeIn(); 65 $dialogWrapper.fadeIn();
63 } 66 }
64 67
  68 + if (fullWithBtn) {
  69 + $('.dialog-wrapper .dialog-footer > span').css('width', '100%');
  70 + $('.dialog-wrapper .dialog-content').css({
  71 + 'padding-left': '1.85rem',
  72 + 'padding-right': '1.85rem'
  73 + });
  74 + $dialogWrapper.css('z-index', '10');
  75 + }
  76 +
65 $dialogBox.css({ 77 $dialogBox.css({
66 top: '50%', 78 top: '50%',
67 marginTop: -($dialogBox.height() / 2) 79 marginTop: -($dialogBox.height() / 2)
@@ -18,6 +18,11 @@ var goodsDiscountEl = document.getElementById('goodsDiscount'), @@ -18,6 +18,11 @@ var goodsDiscountEl = document.getElementById('goodsDiscount'),
18 18
19 var $cart = $('.cart-bar'); 19 var $cart = $('.cart-bar');
20 20
  21 +var limitSaleBtn = document.getElementById('limit-sale'),
  22 + limitSaleHammer = limitSaleBtn && new Hammer(limitSaleBtn);
  23 +
  24 +var dialog = require('../../me/dialog');
  25 +
21 //add extra marign-bottom for footer to show the yoho copyright 26 //add extra marign-bottom for footer to show the yoho copyright
22 function showFooter() { 27 function showFooter() {
23 var $cartBar = $('.cart-bar'); 28 var $cartBar = $('.cart-bar');
@@ -75,6 +80,25 @@ if (goodsDiscountHammer && $discountFolder.children().length > 0) { @@ -75,6 +80,25 @@ if (goodsDiscountHammer && $discountFolder.children().length > 0) {
75 }); 80 });
76 } 81 }
77 82
  83 +limitSaleHammer ? limitSaleHammer.on('tap', function(e) {
  84 + e.srcEvent.stopPropagation();
  85 + dialog.showDialog({
  86 + dialogText: '进入有货APP尖货频道分享\n以获取限购码',
  87 + hasFooter: {
  88 + rightBtnText: '打开Yoho!Buy有货APP'
  89 + }
  90 + }, function() {
  91 + console.log('111');
  92 + }, undefined, true);
  93 +
  94 + $('.dialog-wrapper').off('touchstart').on('touchstart', function(e) {
  95 + e.stopPropagation();
  96 + if ($(e.target).hasClass('dialog-wrapper')) {
  97 + dialog.hideDialog();
  98 + }
  99 + });
  100 +}) : null;
  101 +
78 require('./desc'); 102 require('./desc');
79 require('./comments-consults'); 103 require('./comments-consults');
80 require('../recommend-for-you-product-desc'); 104 require('../recommend-for-you-product-desc');
@@ -276,6 +276,7 @@ $basicBtnC:#eb0313; @@ -276,6 +276,7 @@ $basicBtnC:#eb0313;
276 } 276 }
277 } 277 }
278 .price-date { 278 .price-date {
  279 + position: relative;
279 width: 100%; 280 width: 100%;
280 color: $subFontC; 281 color: $subFontC;
281 height: pxToRem(88px); 282 height: pxToRem(88px);
@@ -284,6 +285,30 @@ $basicBtnC:#eb0313; @@ -284,6 +285,30 @@ $basicBtnC:#eb0313;
284 background-color: #fff; 285 background-color: #fff;
285 border-bottom: 1px solid $borderC; 286 border-bottom: 1px solid $borderC;
286 } 287 }
  288 +
  289 + .limit-sale {
  290 + position: absolute;
  291 + right: pxToRem(84px);
  292 + top: pxToRem(24px);
  293 + color: #d0021b;
  294 + border: 2px solid #d0021b;
  295 + background-color: #fff;
  296 + border-radius: pxToRem(40px);
  297 + padding: pxToRem(4px) pxToRem(20px);
  298 + font-size: pxToRem(24px);
  299 + font-weight: bold;
  300 + }
  301 +
  302 + .limit-sale:active {
  303 + background-color: #f0f0f0;
  304 + }
  305 +
  306 + .got-limit-sale {
  307 + @extend .limit-sale;
  308 + color: #ccc;
  309 + border-color: #ccc;
  310 + }
  311 +
287 .goodsPrice { 312 .goodsPrice {
288 float: left; 313 float: left;
289 font-size: pxToRem(34.59px); 314 font-size: pxToRem(34.59px);