fe / yohobuywap-node · Commits

Go to a project

Authored by lijing
Commit 9a5ebdd22bc28bf965e9f4b61c1a6f5eb3838837 1 parent 9138398a

秒杀详情页改造

Inline Side-by-side
Showing 8 changed files with 140 additions and 215 deletions
... ... @@ -1042,51 +1042,9 @@ let getProductData = (data) => {
productId: result.productId
}),
_getCommonConsult(),
comment.getConsults(result.productId, 1, 2),
getSeckillData({productskn: result.productSkn})
comment.getConsults(result.productId, 1, 2)
]).then((info) => {
// 根据app.product.data接口是否返回isSecKill，判断是否是秒杀
let isSecKills = result.isSecKill === 'Y' ? true : false;
let gList = result.goodsList;
// 统计非秒杀库存数
let commonNum = 0;
gList.forEach(row => {
row.sizeList.forEach(val => {
commonNum = commonNum + val.storageNumber;
});
});
// 统计秒杀库存数
let leftCount = 0;
if (info && info[5] && info[5].secKillSku) {
info[5].secKillSku.forEach(val => {
leftCount = leftCount + val.storageNum;
});
}
// 如果秒杀库存不为0，将商品库存链接至秒杀库存
let i = 0;
if (isSecKills && info[5] && leftCount) {
gList.forEach(row => {
row.sizeList.forEach(val => {
val.storageNumber = info[5].secKillSku[i].storageNum;
val.productSku = info[5].secKillSku[i].productSku;
i++;
});
});
}
// 秒杀详情页弹出层价格
if (isSecKills && leftCount && info[5]) {
result.formatMarketPrice = info[5].formatSecKillPrice;
}
result.promotionBoList = info[1];
finalResult = _detailDataPkg(result, data.uid, data.vipLevel, data.ua);
finalResult.enterStore = info[0];
... ... @@ -1094,33 +1052,6 @@ let getProductData = (data) => {
Object.assign(finalResult.feedbacks, info[2]);
// 秒杀详情页
if (isSecKills && info[5]) {
let end = info[5].status === 3 ? true : false;
if (!end) {
let notStart = info[5].status === 1 ? true : false;
let startIng = info[5].status === 2 ? true : false;
Object.assign(finalResult, {
isSecKill: {
notStart: notStart,
startIng: startIng,
end: end,
productSkn: data.productSkn,
secKillPrice: info[5].formatSecKillPrice,
noneLeft: leftCount === 0 && commonNum === 0 ? true : false
}
});
}
}
/* 如果有咨询，显示咨询，否则显示常见问题 */
if (info[4].total) {
... ...
... ... @@ -63,7 +63,5 @@ router.get('/recommend-for-you/cart', recommendForYou.cart);
router.get('/seckill', seckill.index); // 秒杀列表页
router.post('/seckill/remind', seckill.remind); // only app; 秒杀提醒
router.get(/\/seckill\/detail\/pro_([\d]+)_([\d]+)\/(.*)/, detail.getUser, detail.index); // 秒杀详情页
router.get(/\/seckill\/detail\/show_([\d]+)/, detail.getUser, detail.indexSkn); // 秒杀详情页 SKN 进入
router.get('/seckill/get-product-list', seckill.getProductList); // 秒杀列表根据活动id获取商品列表
module.exports = router;
... ...
... ... @@ -38,9 +38,7 @@
<div class="price-date">
{{# goodsPrice}}
<div class="goods-price">
{{#if ../isSecKill/secKillPrice}}
<h1 class="current-price">{{../isSecKill/secKillPrice}}</h1>
{{else}}
{{#if currentPrice}}
<h1 class="current-price">{{currentPrice}}</h1>
{{/if}}
<h1 class="previous-price">{{previousPrice}}</h1>
... ... @@ -67,24 +65,6 @@
<h1 >{{periodOfMarket}}</h1>
</div>
{{/if}}
{{#isSecKill}}
{{#if startIng}}
<div class="seckill-time seckill-time-border">
<span>距结束 </span>
<span class="end-time">
<i class="tick hour">00</i>:
<i class="tick minute">00</i>:
<i class="tick second">00</i>
</span>
</div>
{{/if}}
{{#if notStart}}
<div class="seckill-time notStart">
<span class="seckill-time-pic">秒杀预告</span>
<span class="seckill-time-c">月日</span>
</div>
{{/if}}
{{/isSecKill}}
</div>
{{#if studentPrice}}
... ... @@ -180,61 +160,40 @@
<div id="productDesc"> </div>
{{> detail/recommend-for-you}}
{{> cart/chose-panel}}
{{# isSecKill}}
{{# notStart}}
<div class="seckill-count">
<div class="seckill-count-bg"></div>
<div class="seckill-count-num">距秒杀开始：
<i class="tick hour">00</i>时
<i class="tick minute">00</i>分
<i class="tick second">00</i>秒
</div>
</div>
{{/notStart}}
{{/isSecKill}}
{{#cartInfo}}
<div class="cart-bar">
<a href="{{cartUrl}}" class="num-incart iconfont"><span class="num-tag hide"></span>&#xe62c;</a>
{{#if ../isSecKill/noneLeft}}
<a href="javascript:;" class="sold-out">已售罄</a>
{{else if ../isSecKill/startIng}}
<a href="javascript:;" id="addtoCart" class="addto-cart">立即购买</a>
{{else if ../isSecKill/notStart}}
<a href="javascript:;" class="sold-out">即将开抢</a>
{{else}}
{{#if addToCartUrl}}
<a id="addtoCart" href="javascript:;" class="addto-cart">{{#if ../tickets}}立即购买{{else}}加入购物车{{/if}}</a>
{{/if}}
{{#if soldOut}}
<a href="javascript:;" class="sold-out">已售罄</a>
{{/if}}
{{#if addToCartUrl}}
<a id="addtoCart" href="javascript:;" class="addto-cart">{{#if ../tickets}}立即购买{{else}}加入购物车{{/if}}</a>
{{/if}}
{{#if notForSale}}
<a href="javascript:;" class="sold-out">非卖品</a>
{{/if}}
{{#if soldOut}}
<a href="javascript:;" class="sold-out">已售罄</a>
{{/if}}
{{#if limitNotForSale}}
<a href="javascript:;" class="sold-out limit">即将发售</a>
{{/if}}
{{#if notForSale}}
<a href="javascript:;" class="sold-out">非卖品</a>
{{/if}}
{{#if canBuyLimit}}
<a href="javascript:;" id="addtoCart" class="addto-cart">立即购买</a>
{{/if}}
{{#if limitNotForSale}}
<a href="javascript:;" class="sold-out limit">即将发售</a>
{{/if}}
{{#if noLimitCode}}
<a href="javascript:;" class="sold-out limit">立即购买</a>
{{/if}}
{{#if canBuyLimit}}
<a href="javascript:;" id="addtoCart" class="addto-cart">立即购买</a>
{{/if}}
<input type="hidden" id="limitCodeUrl" name="limitCodeUrl" value="{{limitCodeUrl}}">
{{#if noLimitCode}}
<a href="javascript:;" class="sold-out limit">立即购买</a>
{{/if}}
<input type="hidden" id="limitProductPay" name="limitProductPay" value="{{limitProductPay}}">
<input type="hidden" id="limitCodeUrl" name="limitCodeUrl" value="{{limitCodeUrl}}">
{{#limitProductCode}}
<input type="hidden" id="limitProductCode" name="limitProductCode" value="{{.}}">
{{/limitProductCode}}
<input type="hidden" id="limitProductPay" name="limitProductPay" value="{{limitProductPay}}">
{{/if}}
{{#limitProductCode}}
<input type="hidden" id="limitProductCode" name="limitProductCode" value="{{.}}">
{{/limitProductCode}}
<a href="javascript:;" id="likeBtn" class="favorite iconfont {{#isCollect}}liked{{/isCollect}}">&#xe605;</a>
</div>
{{/cartInfo}}
... ... @@ -266,7 +225,4 @@
{{/if}}
</div>
{{# isSecKill}}
<input type="hidden" class="productSkn-text" value={{productSkn}} />
{{/isSecKill}}
{{/ result}}
... ...
... ... @@ -30,10 +30,10 @@
<button class="btn btn-remind-off" data-remind data-action="cancel" {{#unless remindFlag}}style="display: none;"{{/unless}}>取消提醒</button>
<button class="btn btn-remind-on" data-remind data-action="add" {{#if remindFlag}}style="display: none;"{{/if}}>提醒我</button>
{{else}}
<a href='/product/seckill/detail/show_{{productSkn}}.html' class="btn btn-buy">即将开抢</a>
<a href='/product/show_{{productSkn}}.html?seckill=1' class="btn btn-buy">即将开抢</a>
{{/if}}
{{else}}
<a href='/product/seckill/detail/show_{{productSkn}}.html?{{#if isApp}}?openby:yohobuy={"action":"go.productDetail","params":{"product_skn":"{{productSkn}}"}}{{/if}}' class="btn btn-buy">去抢购</a>
<a href='/product/show_{{productSkn}}.html?seckill=1{{#if isApp}}&openby:yohobuy={"action":"go.productDetail","params":{"product_skn":"{{productSkn}}"}}{{/if}}' class="btn btn-buy">去抢购</a>
{{/if}}
</div>
</div>
... ...
... ... @@ -9,28 +9,11 @@
<div class="text-info">
<p class="name">{{name}}</p>
<p class="price">
{{#if ../isSecKill/startIng}}
<span class="sale-price">{{../isSecKill/secKillPrice}}</span>
{{#if price}}
<span class="market-price">{{price}}</span>
{{/if}}
{{else}}
<span class="sale-price{{^price}} no-price{{/price}}">{{salePrice}}</span>
{{#if price}}
<span class="market-price">{{price}}</span>
{{/if}}
<span class="sale-price{{^price}} no-price{{/price}}">{{salePrice}}</span>
{{#if price}}
<span class="market-price">{{price}}</span>
{{/if}}
</p>
{{#if ../isSecKill/startIng}}
<div class="seckill-time seckill-time-border seckill-chose">
<span>距结束 </span>
<span class="end-time">
<i class="tick hour">00</i>:
<i class="tick minute">00</i>:
<i class="tick second">00</i>
</span>
</div>
{{/if}}
</div>
</div>
<div class="chose-items">
... ... @@ -62,26 +45,15 @@
<div class="num">
<span>数量</span>
<div class="clearfix">
{{#if ../isSecKill/startIng}}
<a class="btn" href="javascript:void(0);">
<span class="iconfont {{#if promotionId}}disabled{{/if}}">&#xe625;</span>
</a>
<input id="good-num" class="good-num disabled" type="text" value="1" disabled="true">
<a class="btn" href="javascript:void(0);">
<span class="iconfont {{#if promotionId}}disabled{{/if}}">&#xe624;</span>
</a>
<span class="limit-num-text">限购1件</span>
{{else}}
<a class="btn btn-minus" href="javascript:void(0);">
<span class="iconfont {{#if promotionId}}disabled{{/if}}">&#xe625;</span>
</a>
<input id="good-num" class="good-num disabled" type="text" value="1" disabled="true">
<a class="btn btn-plus" href="javascript:void(0);">
<span class="iconfont {{#if promotionId}}disabled{{/if}}">&#xe624;</span>
</a>
{{/if}}
<a class="btn btn-minus" href="javascript:void(0);">
<span class="iconfont {{#if promotionId}}disabled{{/if}}">&#xe625;</span>
</a>
<input id="good-num" class="good-num disabled" type="text" value="1" disabled="true">
<a class="btn btn-plus" href="javascript:void(0);">
<span class="iconfont {{#if promotionId}}disabled{{/if}}">&#xe624;</span>
</a>
</div>
<span class="left-num {{#if ../isSecKill}}hide{{/if}}"></span>
<span class="left-num"></span>
<input id="left-num" type="hidden" value="0">
<input id="limitNum" type="hidden" value="{{limit}}">
</div>
... ... @@ -89,20 +61,13 @@
</div>
</div>
<div class="btn-wrap">
{{#if ../isSecKill/startIng}}
<button id="chose-btn-sure" class="btn btn-sure go-pay isSecKill">
立即抢购
</button>
<button id="chose-btn-sure" class="btn btn-sure go-pay">
{{#if ../tickets}}
立即购买
{{else}}
<button id="chose-btn-sure" class="btn btn-sure go-pay">
{{#if ../tickets}}
立即购买
{{else}}
加入购物车
{{/if}}
</button>
加入购物车
{{/if}}
</button>
</div>
</div>
</div>
... ...
... ... @@ -216,7 +216,7 @@ function updateConformButtonClassAndText() {
} else if (limitProductCode || ticketsLimit) {
$('#chose-btn-sure').css('background-color', '#eb0313').html('立即购买');
} else {
$('#chose-btn-sure').css('background-color', '#eb0313').html(isEdit ? '确认' : '立即结算');
$('#chose-btn-sure').css('background-color', '#eb0313').html(isEdit ? '确认' : '立即购买');
}
} else {
$chosed = $allChoseItems.find('.chosed');
... ... @@ -227,6 +227,7 @@ function updateConformButtonClassAndText() {
} else {
$('#chose-btn-sure').css('background-color', '#eb0313').html(isEdit ? '确认' : '加入购物车');
}
$('#chose-btn-sure').css('background-color', '#eb0313').html(isEdit ? '确认' : '立即结算');
}
}
... ...
... ... @@ -23,7 +23,9 @@ var dialog = require('../plugin/dialog');
require('../common');
require('./tick');
if (window.queryString.seckill) {
require('./tick');
}
// add extra marign-bottom for footer to show the yoho copyright
function showFooter() {
... ...
... ... @@ -58,31 +58,103 @@ seckillObj = {
$(
function() {
var ajaxUrl = '/product/detail/seckillData/' + $('.productSkn-text').val();
$('.cart-bar').hide();
$('.current-price').hide();
var ajaxUrl = '/product/detail/seckillData/' + $('#productSkn').val();
$.ajax({
type: 'GET',
url: ajaxUrl,
success: function(data) {
startTime = data.startTime;
endTime = data.endTime;
if (startTime > nowTime) {
offsetTime = startTime - nowTime;
timeObj = $('.seckill-count-num');
} else if (nowTime > startTime && nowTime < endTime) {
offsetTime = endTime - nowTime;
timeObj = $('.end-time');
// 秒杀是否结束
if (data.status !== 1 && data.status !== 2) {
$('.cart-bar').show();
$('.current-price').show();
} else {
// 秒杀开始前
if (data.status === 1) {
$('.cart-bar').before(
'<div class="seckill-count">' +
'<div class="seckill-count-bg"></div>' +
'<div class="seckill-count-num">距秒杀开始：' +
'<i class="tick hour">00</i>时' +
'<i class="tick minute">00</i>分' +
'<i class="tick second">00</i>秒' +
'</div>' +
'</div>'
);
$('.price-date').append(
'<div class="seckill-time notStart">' +
'<span class="seckill-time-pic">秒杀预告</span>' +
'<span class="seckill-time-c">月日</span>' +
'</div>'
);
$('.cart-bar a:first').append('<a href="javascript:;" class="sold-out">即将开抢</a>');
$('.addto-cart').hide();
$('.cart-bar').show();
}
// 秒杀进行中
if (data.status === 2) {
$('.price-date').append(
'<div class="seckill-time seckill-time-border">' +
'<span>距结束&nbsp</span>' +
'<span class="end-time">' +
'<i class="tick hour">00</i>:' +
'<i class="tick minute">00</i>:' +
'<i class="tick second">00</i>' +
'</span>' +
'</div>'
);
$('.text-info').append(
'<div class="seckill-time seckill-time-border seckill-chose">' +
'<span>距结束 </span>' +
'<span class="end-time">' +
'<i class="tick hour">00</i>:' +
'<i class="tick minute">00</i>:' +
'<i class="tick second">00</i>' +
'</span>' +
'</div>'
);
$('.current-price').text('¥' + data.secKillPrice).show();
$('.sale-price').text('¥' + data.secKillPrice).show();
$('.chose-items .num').find('.clearfix').append(
'<span class="limit-num-text">限购1件</span>'
);
$('.left-num').hide();
$('.btn-plus').removeClass('btn-plus');
$('.addto-cart').text('立即购买');
$('#chose-btn-sure').text('立即抢购').addClass('isSecKill');
$('.cart-bar').show();
var seckillNum = 0;
for (var i = 0; i < data.secKillSku.length; i++) {
seckillNum = seckillNum + data.secKillSku[i].storageNum;
}
if (seckillNum == 0) {
var thisSkn = $('#productSkn').val();
window.location.href = '/product/show_' + thisSkn + '.html';
}
}
startTime = data.startTime;
endTime = data.endTime;
if (startTime > nowTime) {
offsetTime = startTime - nowTime;
timeObj = $('.seckill-count-num');
} else if (nowTime > startTime && nowTime < endTime) {
offsetTime = endTime - nowTime;
timeObj = $('.end-time');
}
dateText = Number(data.startTime * 1000);
newDate = new Date(dateText);
newMonth = newDate.getMonth() + 1;
newDay = newDate.getDate();
newHour = newDate.getHours();
newMinus = newDate.getMinutes();
$('.notStart').find('.seckill-time-c').text(newMonth + '月' + newDay + '日' + newHour + ':' + newMinus);
seckillObj.startTick(timeObj, offsetTime);
}
dateText = Number(data.startTime * 1000);
newDate = new Date(dateText);
newMonth = newDate.getMonth() + 1;
newDay = newDate.getDate();
newHour = newDate.getHours();
newMinus = newDate.getMinutes();
$('.notStart').find('.seckill-time-c').text(newMonth + '月' + newDay + '日' + newHour + ':' + newMinus);
seckillObj.startTick(timeObj, offsetTime);
},
error: function() {
tip.show('网络异常~');
... ...