fe / yohobuywap-node · Commits

Go to a project

Authored by 陈峰
Commit 88866804b168de4494883babca8a650d060c4ac7 1 parent 38b4c831

秒杀列表页接口已经集成

Inline Side-by-side
Showing 8 changed files with 196 additions and 115 deletions
@@ -5,104 +5,114 @@ @@ -5,104 +5,114 @@
5 */ 5 */
6 6
7 'use strict'; 7 'use strict';
  8 +const mRoot = '../models';
8 const headerModel = require('../../../doraemon/models/header'); 9 const headerModel = require('../../../doraemon/models/header');
  10 +const seckillModel = require(`${mRoot}/seckill`);
9 11
  12 +/**
  13 + * [时间缺0补0]
  14 + */
  15 +const _timeFormat = (tick) => {
  16 + return tick < 10 ? `0${tick}` : tick;
  17 +}
10 18
11 /** 19 /**
12 * [秒杀列表页面] 20 * [秒杀列表页面]
13 */ 21 */
14 -const _index = (req, res, next) => { 22 +const index = (req, res, next) => {
15 let headerData = headerModel.setNav({ 23 let headerData = headerModel.setNav({
16 - navTitle: '秒杀活动',  
17 - navBtn: true, 24 + navTitle: '秒杀活动',
  25 + navBtn: true,
  26 + }),
  27 + result = {},
  28 + hbsHelper = {
  29 + helpers: {
  30 + statusClass: (nav) => {
  31 + if (nav.over) {
  32 + return 'over';
  33 + } else if (nav.now) {
  34 + return 'now';
  35 + } else if (nav.wait) {
  36 + return 'wait';
  37 + } else {
  38 + return '';
  39 + }
  40 + }
  41 + }
  42 + };
  43 + return seckillModel.queryActivity().then((resultActivity) => {
  44 + if (resultActivity.code !== 200) {
  45 + return next();
  46 + }
  47 + result.activitys = resultActivity.data.secKillProductVoList;
  48 + let nowTime = Date.parse(new Date());
18 49
19 - }),  
20 - result = {  
21 - products: [{  
22 - id: 1,  
23 - now: true  
24 - }, {  
25 - id: 2,  
26 - wait: true  
27 - }, {  
28 - id: 1,  
29 - over: true  
30 - }, {  
31 - id: 1,  
32 - chance: true  
33 - }],  
34 - navs: [{  
35 - day: '2016/09/1',  
36 - time: '12:00',  
37 - over: true  
38 - }, {  
39 - day: '2016/09/1',  
40 - time: '12:00',  
41 - over: true  
42 - }, {  
43 - day: '2016/09/2',  
44 - time: '12:00',  
45 - over: true  
46 - }, {  
47 - day: '2016/09/2',  
48 - time: '12:00',  
49 - over: true  
50 - }, {  
51 - day: '2016/09/09',  
52 - time: '12:00',  
53 - over: true  
54 - }, {  
55 - day: '2016/09/12',  
56 - time: '10:40',  
57 - now: true  
58 - }, {  
59 - day: '2016/09/12',  
60 - time: '10:50',  
61 - wait: true  
62 - }, {  
63 - day: '2016/09/12',  
64 - time: '11:00',  
65 - wait: true  
66 - }, {  
67 - day: '2016/09/12',  
68 - time: '11:10',  
69 - last: true,  
70 - wait: true  
71 - }]  
72 - },  
73 - hbsHelper = {  
74 - helpers: {  
75 - statusClass: (nav) => {  
76 - if (nav.over) {  
77 - return 'over';  
78 - } else if (nav.now) {  
79 - return 'now';  
80 - } else if (nav.wait) {  
81 - return 'wait'; 50 + result.activitys.forEach((activity, i) => {
  51 + let date,
  52 + hour = 0,
  53 + minute = 0;
  54 +
  55 + activity.startTime *= 1000;
  56 + date = new Date(activity.startTime);
  57 + hour = date.getHours();
  58 + minute = date.getMinutes();
  59 + activity.time = `${_timeFormat(hour)}:${_timeFormat(minute)}`;
  60 +
  61 + if (nowTime > activity.startTime) { // 当前时间大于这个时间段，已经开始和即将开始两种情况
  62 + if (i < result.activitys.length - 1) {
  63 + let nextTime = result.activitys[i + 1].startTime * 1000;
  64 + if (nowTime < nextTime) { // 下一个时间段与当前时间来区别是否正在抢购
  65 + activity.now = true;
  66 + activity.focus = true;
82 } else { 67 } else {
83 - return ''; 68 + activity.over = true;
84 } 69 }
  70 + } else { // 大于这个时间段但是后面没有秒抢时间端了，则依然显示抢购中
  71 + activity.now = true;
85 } 72 }
  73 + } else {
  74 + activity.wait = true;
86 } 75 }
  76 + });
  77 + if (result.activitys.length && result.activitys.findIndex(activity => activity.focus) < 0) {
  78 + result.activitys[0].focus = true;
  79 + }
  80 + let focusActivity = result.activitys.find(activity => activity.focus);
  81 + return seckillModel.queryProductList(focusActivity.activityId).then((resultProducts) => {
  82 + result.products = resultProducts.data;
  83 + res.render('seckill', Object.assign({
  84 + pageHeader: headerData,
  85 + pageFooter: true,
  86 + width750: true,
  87 + times: 12
  88 + }, result, hbsHelper));
  89 + })
  90 +
  91 + })
  92 +};
87 93
88 - };  
89 -  
90 - try {  
91 - let a = 1;  
92 -  
93 - console.log(a);  
94 - } catch (ex) { 94 +/**
  95 + * [xhr根据活动id获取商品列表]
  96 + */
  97 +const getProductList = (req, res, next) => {
  98 + if (!req.xhr) {
95 return next(); 99 return next();
96 } 100 }
97 -  
98 - res.render('seckill', Object.assign({  
99 - pageHeader: headerData,  
100 - pageFooter: true,  
101 - width750: true,  
102 - times: 12  
103 - }, result, hbsHelper));  
104 -}; 101 + let activityId = req.query.activityId;
  102 + if (!activityId) {
  103 + return next();
  104 + }
  105 + return seckillModel.queryProductList(activityId).then((resultProducts) => {
  106 + let result = {
  107 + products: resultProducts.data
  108 + }
  109 + res.render('seckill/product-list', Object.assign(result, {
  110 + layout: false
  111 + }));
  112 + })
  113 +}
105 114
106 module.exports = { 115 module.exports = {
107 - index: _index 116 + index,
  117 + getProductList
108 }; 118 };
  1 +/**
  2 + * 秒杀models
  3 + * @author: 陈峰<feng.chen@yoho.cn>
  4 + * @date: 2016/9/18
  5 + */
  6 +
  7 +'use strict';
  8 +
  9 +const api = global.yoho.API;
  10 +
  11 +/**
  12 + * [获取秒杀时间栏接口]
  13 + * @return {[object]}
  14 + */
  15 +const queryActivity = () => {
  16 + return api.get('', {
  17 + method: 'app.seckill.queryActivity'
  18 + }, {
  19 + cache: true
  20 + });
  21 +}
  22 +
  23 +/**
  24 + * [获取指定秒杀活动商品列表接口]
  25 + * @param {[int]} activityId [秒杀活动id]
  26 + * @return {[object]}
  27 + */
  28 +const queryProductList = (activityId) => {
  29 + return api.get('', {
  30 + method: 'app.seckill.queryProductList',
  31 + activityId: activityId
  32 + }, {
  33 + cache: true
  34 + });
  35 +}
  36 +
  37 +module.exports = {
  38 + queryActivity,
  39 + queryProductList
  40 +}
@@ -61,5 +61,6 @@ router.get('/recommend-for-you/userCenter', recommendForYou.userCenter); @@ -61,5 +61,6 @@ router.get('/recommend-for-you/userCenter', recommendForYou.userCenter);
61 router.get('/recommend-for-you/cart', recommendForYou.cart); 61 router.get('/recommend-for-you/cart', recommendForYou.cart);
62 62
63 router.get('/seckill', seckill.index); // 秒杀列表页 63 router.get('/seckill', seckill.index); // 秒杀列表页
  64 +router.get('/seckill/get-product-list', seckill.getProductList); // 秒杀列表根据活动id获取商品列表
64 65
65 module.exports = router; 66 module.exports = router;
  1 +{{# products}}
  2 + {{> seckill/product}}
  3 +{{/products}}
1 <nav class="nav-list"> 1 <nav class="nav-list">
2 <ul class="nav-ul hide"> 2 <ul class="nav-ul hide">
3 - {{# navs}}  
4 - <li class="time-item {{# if now}}focus{{/if}} {{statusClass this}} {{# if @last}}last{{/if}}">  
5 - <input type="hidden" name="" class="date" value="{{day}} {{time}}"> 3 + {{# activitys}}
  4 + <li class="time-item {{# if @last}}last{{/if}} {{# if focus}}focus{{/if}} {{statusClass this}}">
  5 + <input type="hidden" name="" class="date" value="{{startTime}}">
  6 + <input type="hidden" name="" class="activityId" value="{{activityId}}">
6 <div class="normal"> 7 <div class="normal">
7 <p class="time">{{time}}</p> 8 <p class="time">{{time}}</p>
8 <p class="status tip-over">已开抢</p> 9 <p class="status tip-over">已开抢</p>
@@ -34,6 +35,6 @@ @@ -34,6 +35,6 @@
34 </div> 35 </div>
35 </div> 36 </div>
36 </li> 37 </li>
37 - {{/navs}} 38 + {{/activitys}}
38 </ul> 39 </ul>
39 </nav> 40 </nav>
1 <a href="#" class="item"> 1 <a href="#" class="item">
2 <div class="item-img"> 2 <div class="item-img">
3 - <img src="//img10.static.yhbimg.com/goodsimg/2016/09/06/16/010f4203952bfb27f121a8778421c14f97.jpg?imageView/2/w/235/h/314" alt=""> 3 + <img src="{{image coverUrl 235 314}}" alt="">
4 </div> 4 </div>
5 <div class="item-info"> 5 <div class="item-info">
6 <div class="item-title"> 6 <div class="item-title">
7 - 影时光Mtime 联盟之剑手机壳iPhone6/6s 7 + {{productName}}
8 </div> 8 </div>
9 {{# if wait}} 9 {{# if wait}}
10 <div class="item-price"> 10 <div class="item-price">
11 - <ins>¥99</ins><del>¥234</del> 11 + <ins>¥{{secKillPrice}}</ins><del>¥{{marketPrice}}</del>
12 </div> 12 </div>
13 {{/if}} 13 {{/if}}
14 14
@@ -17,7 +17,7 @@ @@ -17,7 +17,7 @@
17 <div class="item-time"><span><i class="iconfont">&#xe603;</i><time>8月31日 19:00</time>开始</span></div> 17 <div class="item-time"><span><i class="iconfont">&#xe603;</i><time>8月31日 19:00</time>开始</span></div>
18 {{else}} 18 {{else}}
19 <div class="item-price"> 19 <div class="item-price">
20 - <ins>¥99</ins><del>¥234</del> 20 + <ins>¥{{secKillPrice}}</ins><del>¥{{marketPrice}}</del>
21 </div> 21 </div>
22 {{/if}} 22 {{/if}}
23 23
@@ -16,7 +16,7 @@ module.exports = { @@ -16,7 +16,7 @@ module.exports = {
16 domains: { 16 domains: {
17 // api: 'http://devapi.yoho.cn:58078/', 17 // api: 'http://devapi.yoho.cn:58078/',
18 // service: 'http://devservice.yoho.cn:58077/' 18 // service: 'http://devservice.yoho.cn:58077/'
19 - api: 'http://api.yoho.cn/', 19 + api: 'http://dev-api.yohops.com:9999/',
20 service: 'http://service.yoho.cn/', 20 service: 'http://service.yoho.cn/',
21 liveApi: 'http://testapi.live.yohops.com:9999/' 21 liveApi: 'http://testapi.live.yohops.com:9999/'
22 }, 22 },
@@ -5,6 +5,7 @@ @@ -5,6 +5,7 @@
5 */ 5 */
6 var $ = require('yoho-jquery'), 6 var $ = require('yoho-jquery'),
7 IScroll = require('yoho-iscroll'), 7 IScroll = require('yoho-iscroll'),
  8 + tip = require('../plugin/tip'),
8 seckillObj = {}; 9 seckillObj = {};
9 10
10 seckillObj = { 11 seckillObj = {
@@ -40,7 +41,7 @@ seckillObj = { @@ -40,7 +41,7 @@ seckillObj = {
40 that.initNav(); 41 that.initNav();
41 42
42 if (focus.length && (focus.hasClass('now') || focus.hasClass('wait'))) { 43 if (focus.length && (focus.hasClass('now') || focus.hasClass('wait'))) {
43 - that.initTick($('.nav-ul>li.focus')); 44 + that.initTick($el.$navUl.find('>li.focus'));
44 } 45 }
45 }, 46 },
46 47
@@ -53,7 +54,7 @@ seckillObj = { @@ -53,7 +54,7 @@ seckillObj = {
53 $el.timeWidth = ($el.$navUl.find('>li:not(.focus)').width() + 1); 54 $el.timeWidth = ($el.$navUl.find('>li:not(.focus)').width() + 1);
54 $el.focusTimeWidth = ($el.$navUl.find('>li.focus').width() + 1); 55 $el.focusTimeWidth = ($el.$navUl.find('>li.focus').width() + 1);
55 56
56 - $el.$navUl.width(($el.times - 1) * $el.timeWidth + $el.focusTimeWidth).removeClass('hide'); 57 + $el.$navUl.width($el.times * $el.timeWidth + $el.focusTimeWidth).removeClass('hide');
57 58
58 // 只有时间段大于3个才需要定位 59 // 只有时间段大于3个才需要定位
59 if ($el.$navUl.find('>li').length > 3 && $el.$navUl.find('>li.focus').length) { 60 if ($el.$navUl.find('>li').length > 3 && $el.$navUl.find('>li.focus').length) {
@@ -129,17 +130,24 @@ seckillObj = { @@ -129,17 +130,24 @@ seckillObj = {
129 } 130 }
130 } 131 }
131 132
  133 + if ($el.currentTick) {
  134 + clearTimeout($el.currentTick);
  135 + $el.currentTick = undefined;
  136 + }
  137 +
132 if ($(elem).hasClass('now') || $(elem).hasClass('wait')) { 138 if ($(elem).hasClass('now') || $(elem).hasClass('wait')) {
133 // 初始化倒计时并开始计时 139 // 初始化倒计时并开始计时
134 that.initTick(elem); 140 that.initTick(elem);
135 } 141 }
  142 + // 刷新商品列表
  143 + that.refreshProductList($(elem).find('input.activityId').val());
136 }, 144 },
137 145
138 /** 146 /**
139 * [刷新状态] 147 * [刷新状态]
140 */ 148 */
141 refreshList: function(elem) { 149 refreshList: function(elem) {
142 - var $el = this.el, time, nowTime, nextTime; 150 + var $el = this.el, that = this, time, nowTime, nextTime;
143 151
144 // 刷新时间段状态 152 // 刷新时间段状态
145 $el.$navUl.find('>li').each(function() { 153 $el.$navUl.find('>li').each(function() {
@@ -159,14 +167,32 @@ seckillObj = { @@ -159,14 +167,32 @@ seckillObj = {
159 } else { // 大于这个时间段但是后面没有秒抢时间端了，则依然显示抢购中 167 } else { // 大于这个时间段但是后面没有秒抢时间端了，则依然显示抢购中
160 $(this).addClass('now'); 168 $(this).addClass('now');
161 } 169 }
162 - } else if (!$(this).hasClass('nothing')) { 170 + } else {
163 $(this).addClass('wait'); 171 $(this).addClass('wait');
164 } 172 }
165 }); 173 });
166 -  
167 - // 刷新列表状态  
168 - console.log('刷新啊');  
169 - console.log(elem); 174 + // 刷新商品列表
  175 + var focusElem = $el.$navUl.find('>li.focus');
  176 + if (focusElem.length) {
  177 + that.refreshProductList(focusElem.find('input.activityId').val());
  178 + }
  179 + },
  180 + /**
  181 + * [异步加载商品列表]
  182 + */
  183 + refreshProductList: function(activityId) {
  184 + $.ajax({
  185 + url: '/product/seckill/get-product-list',
  186 + data: {
  187 + activityId: activityId
  188 + },
  189 + success: function(data) {
  190 + $('.product-list').html(data);
  191 + },
  192 + error: function(data) {
  193 + tip.show('网络断开连接了~');
  194 + }
  195 + })
170 }, 196 },
171 197
172 /** 198 /**
@@ -178,14 +204,10 @@ seckillObj = { @@ -178,14 +204,10 @@ seckillObj = {
178 nowTime = Date.parse(new Date()) / 1000, 204 nowTime = Date.parse(new Date()) / 1000,
179 offsetTime; 205 offsetTime;
180 206
181 - if ($el.currentTick) {  
182 - clearTimeout($el.currentTick);  
183 - }  
184 -  
185 if ($(elem).hasClass('now')) { 207 if ($(elem).hasClass('now')) {
186 - time = Date.parse(new Date($(elem).next().find('input.date').val())) / 1000; 208 + time = $(elem).next().find('input.date').val() / 1000;
187 } else { 209 } else {
188 - time = Date.parse(new Date($(elem).find('input.date').val())) / 1000; 210 + time = $(elem).find('input.date').val() / 1000;
189 } 211 }
190 offsetTime = time - nowTime; 212 offsetTime = time - nowTime;
191 that.startTick(elem, offsetTime); 213 that.startTick(elem, offsetTime);
@@ -196,20 +218,24 @@ seckillObj = { @@ -196,20 +218,24 @@ seckillObj = {
196 */ 218 */
197 startTick: function(elem, offsetTime) { 219 startTick: function(elem, offsetTime) {
198 var that = this, 220 var that = this,
  221 + $el = this.el,
199 hour = parseInt(offsetTime / (60 * 60), 10), 222 hour = parseInt(offsetTime / (60 * 60), 10),
200 minute = parseInt(offsetTime % (60 * 60) / 60, 10), 223 minute = parseInt(offsetTime % (60 * 60) / 60, 10),
201 second = offsetTime % 60; 224 second = offsetTime % 60;
202 225
203 - $(elem).find('.tick.hour').text(hour < 0 ? '00' : (hour < 10 ? ('0' + hour) : hour));  
204 - $(elem).find('.tick.minute').text(minute < 0 ? '00' : (minute < 10 ? ('0' + minute) : minute));  
205 - $(elem).find('.tick.second').text(second < 0 ? '00' : (second < 10 ? ('0' + second) : second));  
206 - if (offsetTime <= 0) { // 结束倒计时刷新状态  
207 - that.refreshList(elem);  
208 - } else {  
209 - setTimeout(function() {  
210 - that.startTick(elem, --offsetTime);  
211 - }, 1000); 226 + if (offsetTime) {
  227 + $(elem).find('.tick.hour').text(hour < 0 ? '00' : (hour < 10 ? ('0' + hour) : hour));
  228 + $(elem).find('.tick.minute').text(minute < 0 ? '00' : (minute < 10 ? ('0' + minute) : minute));
  229 + $(elem).find('.tick.second').text(second < 0 ? '00' : (second < 10 ? ('0' + second) : second));
  230 + if (offsetTime <= 0) { // 结束倒计时刷新状态
  231 + that.refreshList(elem);
  232 + } else {
  233 + $el.currentTick = setTimeout(function() {
  234 + that.startTick(elem, --offsetTime);
  235 + }, 1000);
  236 + }
212 } 237 }
  238 +
213 } 239 }
214 }; 240 };
215 241