fe / yohobuywap-node · Commits

Go to a project

Authored by 李靖
Commit 2a1413d1a7a8b03de1af2d5e5bbcc46e57e3a1ac 1 parent b67dc119

图片背景，滚动插件，取消驼峰，home新路由，点击关闭头部菜单等

Inline Side-by-side
Showing 15 changed files with 145 additions and 69 deletions
@@ -39,7 +39,7 @@ exports.index = (req, res, next) => { @@ -39,7 +39,7 @@ exports.index = (req, res, next) => {
39 39
40 let params = { 40 let params = {
41 uid: req.user.uid, 41 uid: req.user.uid,
42 - udid: require('yoho-md5')(req.ip), 42 + udid: req.sessionID || 'yoho',
43 contentCode: 'b2b5cde8144aff3073573c3b323344ab', 43 contentCode: 'b2b5cde8144aff3073573c3b323344ab',
44 channel: (req.query.gender && yhchannels[req.query.gender]) || 44 channel: (req.query.gender && yhchannels[req.query.gender]) ||
45 (req.cookies._Channel && channels[req.cookies._Channel]) || 1 45 (req.cookies._Channel && channels[req.cookies._Channel]) || 1
1 'use strict'; 1 'use strict';
2 2
3 const _ = require('lodash'); 3 const _ = require('lodash');
4 -const camelCase = global.yoho.camelCase;  
5 const utils = '../../../utils'; 4 const utils = '../../../utils';
6 const resourcesProcess = require(`${utils}/resources-process`); 5 const resourcesProcess = require(`${utils}/resources-process`);
7 const helpers = global.yoho.helpers; 6 const helpers = global.yoho.helpers;
@@ -163,9 +162,9 @@ class newHome extends global.yoho.BaseModel { @@ -163,9 +162,9 @@ class newHome extends global.yoho.BaseModel {
163 baseInfo: {}, 162 baseInfo: {},
164 infoNum: {}, 163 infoNum: {},
165 signinUrl: helpers.urlFormat('/signin.html', { 164 signinUrl: helpers.urlFormat('/signin.html', {
166 - refer: helpers.urlFormat('/home/new-home') 165 + refer: helpers.urlFormat('/home')
167 }), 166 }),
168 - referUrl: helpers.urlFormat('/home/new-home'), 167 + referUrl: helpers.urlFormat('/home'),
169 channel: { 168 channel: {
170 boys: params.channel === 1, 169 boys: params.channel === 1,
171 girls: params.channel === 2, 170 girls: params.channel === 2,
@@ -201,8 +200,6 @@ class newHome extends global.yoho.BaseModel { @@ -201,8 +200,6 @@ class newHome extends global.yoho.BaseModel {
201 resu.content = result[5]; 200 resu.content = result[5];
202 } 201 }
203 202
204 - resu = camelCase(resu);  
205 -  
206 return resu; 203 return resu;
207 }); 204 });
208 } 205 }
@@ -67,7 +67,7 @@ router.post('/orders/changeAddress', orderDetailController.changeAddress); // @@ -67,7 +67,7 @@ router.post('/orders/changeAddress', orderDetailController.changeAddress); //
67 router.post('/orders/sure', auth, orderController.sure); // 确认收货 67 router.post('/orders/sure', auth, orderController.sure); // 确认收货
68 68
69 69
70 -router.get('/', disableBFCache, homeController.index); // 个人中心首页 70 +// router.get('/', disableBFCache, homeController.index); // 个人中心首页
71 router.get('/mydetails', auth, disableBFCache, homeController.myDetails); // 个人基本资料页面 71 router.get('/mydetails', auth, disableBFCache, homeController.myDetails); // 个人基本资料页面
72 72
73 // router.get('/grade', auth, homeController.grade); // 会员等级页 73 // router.get('/grade', auth, homeController.grade); // 会员等级页
@@ -179,5 +179,5 @@ router.get('/return/exchange/refreshDelivery', auth, exchange.refreshDelivery); @@ -179,5 +179,5 @@ router.get('/return/exchange/refreshDelivery', auth, exchange.refreshDelivery);
179 179
180 router.get('/tide-command', auth, tideCommand.tideCommand); // 设置潮流口令 180 router.get('/tide-command', auth, tideCommand.tideCommand); // 设置潮流口令
181 181
182 -router.get('/new-home', newHome.index); // 设置潮流口令 182 +router.get('/', newHome.index); // 设置潮流口令
183 module.exports = router; 183 module.exports = router;
@@ -4,8 +4,8 @@ @@ -4,8 +4,8 @@
4 {{# baseInfo}} 4 {{# baseInfo}}
5 <a href="/home/mydetails"> 5 <a href="/home/mydetails">
6 <div class="left"> 6 <div class="left">
7 - <div class="user-avatar" data-avatar="{{image2 headIco mode=2 w=100 h=100 q=90}}"></div>  
8 - <div class="level level-{{vipInfo/curLevel}}"></div> 7 + <div class="user-avatar" data-avatar="{{image2 head_ico mode=2 w=100 h=100 q=90}}"></div>
  8 + <div class="level level-{{vip_info/cur_level}}"></div>
9 </div> 9 </div>
10 <div class="right"> 10 <div class="right">
11 <div class="name eps">{{nickname}}</div> 11 <div class="name eps">{{nickname}}</div>
@@ -70,8 +70,8 @@ @@ -70,8 +70,8 @@
70 <div class="service-item"> 70 <div class="service-item">
71 <div class="iconfont pic">&#xe634;</div> 71 <div class="iconfont pic">&#xe634;</div>
72 <p class="name">待付款</p> 72 <p class="name">待付款</p>
73 - {{#if waitPayNum}}  
74 - <div class="val">{{waitPayNum}}</div> 73 + {{#if wait_pay_num}}
  74 + <div class="val">{{wait_pay_num}}</div>
75 {{/if}} 75 {{/if}}
76 </div> 76 </div>
77 </a> 77 </a>
@@ -79,8 +79,8 @@ @@ -79,8 +79,8 @@
79 <div class="service-item"> 79 <div class="service-item">
80 <div class="iconfont pic">&#xe63b;</div> 80 <div class="iconfont pic">&#xe63b;</div>
81 <p class="name">待发货</p> 81 <p class="name">待发货</p>
82 - {{#if waitCargoNum}}  
83 - <div class="val">{{waitCargoNum}}</div> 82 + {{#if wait_cargo_num}}
  83 + <div class="val">{{wait_cargo_num}}</div>
84 {{/if}} 84 {{/if}}
85 </div> 85 </div>
86 </a> 86 </a>
@@ -88,26 +88,26 @@ @@ -88,26 +88,26 @@
88 <div class="service-item"> 88 <div class="service-item">
89 <div class="iconfont pic">&#xe633;</div> 89 <div class="iconfont pic">&#xe633;</div>
90 <p class="name">待收货</p> 90 <p class="name">待收货</p>
91 - {{#if sendCargoNum}}  
92 - <div class="val">{{sendCargoNum}}</div> 91 + {{#if send_cargo_num}}
  92 + <div class="val">{{send_cargo_num}}</div>
93 {{/if}} 93 {{/if}}
94 </div> 94 </div>
95 </a> 95 </a>
96 <div class="service-item"> 96 <div class="service-item">
97 <a href="/home/favorite"> 97 <a href="/home/favorite">
98 - <p class="num">{{#if productFavoriteTotal}}{{productFavoriteTotal}}{{else}}0{{/if}}</p> 98 + <p class="num">{{#if product_favorite_total}}{{product_favorite_total}}{{else}}0{{/if}}</p>
99 <p class="name">商品收藏</p> 99 <p class="name">商品收藏</p>
100 </a> 100 </a>
101 </div> 101 </div>
102 <div class="service-item"> 102 <div class="service-item">
103 <a href="/home/favorite?tab=brand"> 103 <a href="/home/favorite?tab=brand">
104 - <p class="num">{{#if brandFavoriteTotal}}{{brandFavoriteTotal}}{{else}}0{{/if}}</p> 104 + <p class="num">{{#if brand_favorite_total}}{{brand_favorite_total}}{{else}}0{{/if}}</p>
105 <p class="name">品牌收藏</p> 105 <p class="name">品牌收藏</p>
106 </a> 106 </a>
107 </div> 107 </div>
108 <div class="service-item"> 108 <div class="service-item">
109 <a href="/home/record"> 109 <a href="/home/record">
110 - <p class="num">{{#if productBrowse}}{{productBrowse}}{{else}}0{{/if}}</p> 110 + <p class="num">{{#if product_browse}}{{product_browse}}{{else}}0{{/if}}</p>
111 <p class="name">浏览记录</p> 111 <p class="name">浏览记录</p>
112 </a> 112 </a>
113 </div> 113 </div>
@@ -117,7 +117,7 @@ @@ -117,7 +117,7 @@
117 <div class="pic iconfont">&#xe63a;</div> 117 <div class="pic iconfont">&#xe63a;</div>
118 <div class="body"> 118 <div class="body">
119 <div class="main eps">优惠券</div> 119 <div class="main eps">优惠券</div>
120 - <div class="value">{{#if couponNum}}{{couponNum}}张{{/if}}</div> 120 + <div class="value">{{#if coupon_num}}{{coupon_num}}张{{/if}}</div>
121 <div class="arr iconfont">&#xe604;</div> 121 <div class="arr iconfont">&#xe604;</div>
122 </div> 122 </div>
123 </a> 123 </a>
@@ -125,7 +125,7 @@ @@ -125,7 +125,7 @@
125 <div class="pic iconfont">&#xe732;</div> 125 <div class="pic iconfont">&#xe732;</div>
126 <div class="body"> 126 <div class="body">
127 <div class="main eps">有货币</div> 127 <div class="main eps">有货币</div>
128 - <div class="value">{{#if yohoCoinNum}}{{yohoCoinNum}}个{{/if}}</div> 128 + <div class="value">{{#if yoho_coin_num}}{{yoho_coin_num}}个{{/if}}</div>
129 <div class="arr iconfont">&#xe604;</div> 129 <div class="arr iconfont">&#xe604;</div>
130 </div> 130 </div>
131 </a> 131 </a>
@@ -135,7 +135,7 @@ @@ -135,7 +135,7 @@
135 <div class="pic iconfont">&#xe63f;</div> 135 <div class="pic iconfont">&#xe63f;</div>
136 <div class="body"> 136 <div class="body">
137 <div class="main eps">消息</div> 137 <div class="main eps">消息</div>
138 - <div class="value">{{#if inboxTotal}}{{inboxTotal}}条未读{{/if}}</div> 138 + <div class="value">{{#if inbox_total}}{{inbox_total}}条未读{{/if}}</div>
139 <div class="arr iconfont">&#xe604;</div> 139 <div class="arr iconfont">&#xe604;</div>
140 </div> 140 </div>
141 </a> 141 </a>
@@ -70,6 +70,7 @@ @@ -70,6 +70,7 @@
70 {{^}} 70 {{^}}
71 <div class="homebuttom hide"> 71 <div class="homebuttom hide">
72 {{/ @root.pageChannel}} 72 {{/ @root.pageChannel}}
  73 + <div class="ul-arr"></div>
73 <ul> 74 <ul>
74 <li> 75 <li>
75 <a href="{{ indexUrl }}"> 76 <a href="{{ indexUrl }}">
@@ -304,6 +304,17 @@ $('.nav-home').on('touchstart', function() { @@ -304,6 +304,17 @@ $('.nav-home').on('touchstart', function() {
304 $('.homebuttom').toggleClass('hide'); 304 $('.homebuttom').toggleClass('hide');
305 }); 305 });
306 306
  307 +// 点击关闭头部菜单
  308 +$('.main-wrap').on('click', '*', (e) => {
  309 + let $this = $(e.currentTarget);
  310 +
  311 + if (!$this.hasClass('nav-home')) {
  312 + $('.homebuttom').addClass('hide');
  313 + } else {
  314 + return false;
  315 + }
  316 +});
  317 +
307 // 商品列表找相似按钮 318 // 商品列表找相似按钮
308 $('body').on('touchstart', '.similar-btn', function() { 319 $('body').on('touchstart', '.similar-btn', function() {
309 let $thisP = $(this).parents('.good-info'); 320 let $thisP = $(this).parents('.good-info');
@@ -5,37 +5,40 @@ import Page from 'yoho-page'; @@ -5,37 +5,40 @@ import Page from 'yoho-page';
5 import 'common/set-trend-world'; 5 import 'common/set-trend-world';
6 import Swiper from 'yoho-swiper2'; 6 import Swiper from 'yoho-swiper2';
7 import yoho from 'yoho-app'; 7 import yoho from 'yoho-app';
  8 +import AutoScroll from './new-home/auto-scroll';
8 9
9 class NewHome extends Page { 10 class NewHome extends Page {
10 constructor() { 11 constructor() {
11 super(); 12 super();
12 13
13 this.selector = { 14 this.selector = {
14 - $scrollC: $('.scroll-c'),  
15 - $scrollWords: $('.scroll-words'),  
16 $userAvatar: $('.user-avatar'), 15 $userAvatar: $('.user-avatar'),
17 $codeSet: $('.code-set'), 16 $codeSet: $('.code-set'),
18 $resYas: $('.res-c').find('a'), 17 $resYas: $('.res-c').find('a'),
19 $trendCode: $('.trend-code') 18 $trendCode: $('.trend-code')
20 }; 19 };
21 20
22 - this.time = 6000;  
23 - this.containerWidth = 0;  
24 - this.innerWidth = 0;  
25 - this.moveLength = 0;  
26 - this.interval = '';  
27 this.init(); 21 this.init();
28 } 22 }
29 23
30 init() { 24 init() {
31 - this.autoScroll();  
32 this.defaultPic(); 25 this.defaultPic();
33 this.bindEvents(); 26 this.bindEvents();
34 this.swiper(); 27 this.swiper();
35 this.showTrend(); 28 this.showTrend();
  29 + this.autoScroll();
36 window.reMarginFooter('.footer-tab'); 30 window.reMarginFooter('.footer-tab');
37 } 31 }
38 32
  33 + autoScroll() {
  34 + new AutoScroll(
  35 + {
  36 + scrollC: $('.scroll-c'), // 内容
  37 + scrollWords: $('.scroll-words') // 容器
  38 + }
  39 + );
  40 + }
  41 +
39 // 首次进入个人中心，且登陆，且没有设置潮流口令，打开弹框子 42 // 首次进入个人中心，且登陆，且没有设置潮流口令，打开弹框子
40 showTrend() { 43 showTrend() {
41 if (yoho.isLogin() && (!this.selector.$trendCode.html()) && !window.cookie('first-trend')) { 44 if (yoho.isLogin() && (!this.selector.$trendCode.html()) && !window.cookie('first-trend')) {
@@ -50,7 +53,6 @@ class NewHome extends Page { @@ -50,7 +53,6 @@ class NewHome extends Page {
50 bindEvents() { 53 bindEvents() {
51 this.selector.$codeSet.on('click', this.codeSet.bind(this)); 54 this.selector.$codeSet.on('click', this.codeSet.bind(this));
52 this.selector.$resYas.on('click', this.yas.bind(this)); 55 this.selector.$resYas.on('click', this.yas.bind(this));
53 - this.selector.$scrollWords.on('DOMNodeInserted', this.chanScroll.bind(this));  
54 } 56 }
55 57
56 // 资源位 58 // 资源位
@@ -113,39 +115,6 @@ class NewHome extends Page { @@ -113,39 +115,6 @@ class NewHome extends Page {
113 $('.set-trend-world').show(); 115 $('.set-trend-world').show();
114 return false; 116 return false;
115 } 117 }
116 -  
117 - // 触发修改滚动  
118 - chanScroll() {  
119 - this.selector.$scrollWords.stop(true, true);  
120 - clearInterval(this.interval);  
121 - setTimeout(() => {  
122 - this.autoScroll();  
123 - }, 500);  
124 - }  
125 -  
126 - // 判断滚动  
127 - autoScroll() {  
128 - this.containerWidth = this.selector.$scrollC.width();  
129 - this.innerWidth = this.selector.$scrollWords.width();  
130 - this.moveLength = this.innerWidth - this.containerWidth;  
131 - if (this.innerWidth > (this.containerWidth + 1)) {  
132 - this.goScroll();  
133 - this.interval = setInterval(() => {  
134 - this.goScroll();  
135 - }, this.time);  
136 - } else {  
137 - clearInterval(this.interval);  
138 - }  
139 - }  
140 -  
141 - // 滚动  
142 - goScroll() {  
143 - let $animateObj = this.selector.$scrollWords;  
144 -  
145 - $animateObj.animate({left: `-${this.moveLength}px`}, this.time / 2, 'linear', () => {  
146 - $animateObj.animate({left: '0'}, this.time / 2, 'linear');  
147 - });  
148 - }  
149 } 118 }
150 119
151 $(() => { 120 $(() => {
  1 +import Page from 'yoho-page';
  2 +
  3 +class AutoScroll extends Page {
  4 + constructor(data) {
  5 + super();
  6 +
  7 + this.selector = {
  8 + $scrollC: data.scrollC,
  9 + $scrollWords: data.scrollWords
  10 + };
  11 +
  12 + this.time = 6000;
  13 + this.containerWidth = 0;
  14 + this.innerWidth = 0;
  15 + this.moveLength = 0;
  16 + this.interval = '';
  17 + this.init();
  18 + }
  19 +
  20 + init() {
  21 + this.autoScroll();
  22 + this.bindEvents();
  23 + }
  24 +
  25 +
  26 + bindEvents() {
  27 + this.selector.$scrollWords.on('DOMNodeInserted', this.chanScroll.bind(this));
  28 + }
  29 +
  30 + // 触发修改滚动
  31 + chanScroll() {
  32 + this.selector.$scrollWords.stop(true, true);
  33 + clearInterval(this.interval);
  34 + setTimeout(() => {
  35 + this.autoScroll();
  36 + }, 500);
  37 + }
  38 +
  39 + // 判断滚动
  40 + autoScroll() {
  41 + this.containerWidth = this.selector.$scrollC.width();
  42 + this.innerWidth = this.selector.$scrollWords.width();
  43 + this.moveLength = this.innerWidth - this.containerWidth;
  44 + if (this.innerWidth > (this.containerWidth + 1)) {
  45 + this.goScroll();
  46 + this.interval = setInterval(() => {
  47 + this.goScroll();
  48 + }, this.time);
  49 + } else {
  50 + clearInterval(this.interval);
  51 + }
  52 + }
  53 +
  54 + // 滚动
  55 + goScroll() {
  56 + let $animateObj = this.selector.$scrollWords;
  57 +
  58 + $animateObj.animate({left: `-${this.moveLength}px`}, this.time / 2, 'linear', () => {
  59 + $animateObj.animate({left: '0'}, this.time / 2, 'linear');
  60 + });
  61 + }
  62 +}
  63 +
  64 +module.exports = AutoScroll;
@@ -361,7 +361,7 @@ @@ -361,7 +361,7 @@
361 height: 35px; 361 height: 35px;
362 margin: 0 auto; 362 margin: 0 auto;
363 background-size: 100% 100%; 363 background-size: 100% 100%;
364 - background-image: resolve("yohologo02.png"); 364 + background-image: resolve("yohobuy-grey.png");
365 } 365 }
366 } 366 }
367 } 367 }
@@ -202,7 +202,8 @@ @@ -202,7 +202,8 @@
202 padding-top: 17px; 202 padding-top: 17px;
203 203
204 &.boys { 204 &.boys {
205 - background-image: resolve("common/homebuttom-bg.png"); 205 + ul {
  206 + background-image: linear-gradient(#434343, #171717);
206 207
207 li { 208 li {
208 span { 209 span {
@@ -211,16 +212,48 @@ @@ -211,16 +212,48 @@
211 } 212 }
212 } 213 }
213 214
  215 + .ul-arr {
  216 + background-color: #434343;
  217 + }
  218 + }
  219 +
214 &.girls { 220 &.girls {
215 - background-image: resolve("common/homebuttom-bg-1.png"); 221 + ul {
  222 + background-image: linear-gradient(#fc89ad, #e96e94);
  223 + }
  224 +
  225 + .ul-arr {
  226 + background-color: #fc89ad;
  227 + }
216 } 228 }
217 229
218 &.kids { 230 &.kids {
219 - background-image: resolve("common/homebuttom-bg-2.png"); 231 + ul {
  232 + background-image: linear-gradient(#7ed3f7, #5fc9f6);
  233 + }
  234 +
  235 + .ul-arr {
  236 + background-color: #7ed3f7;
  237 + }
220 } 238 }
221 239
222 &.life-style { 240 &.life-style {
223 - background-image: resolve("common/homebuttom-bg-3.png"); 241 + ul {
  242 + background-image: linear-gradient(#5e4a3c, #4c3727);
  243 + }
  244 +
  245 + .ul-arr {
  246 + background-color: #5e4a3c;
  247 + }
  248 + }
  249 +
  250 + .ul-arr {
  251 + width: 26px;
  252 + height: 26px;
  253 + position: absolute;
  254 + top: 4px;
  255 + right: 32px;
  256 + transform: rotate(45deg);
224 } 257 }
225 258
226 ul { 259 ul {
@@ -228,6 +261,7 @@ @@ -228,6 +261,7 @@
228 width: 100%; 261 width: 100%;
229 height: 338px; 262 height: 338px;
230 padding: 1px 0; 263 padding: 1px 0;
  264 + border-radius: 10px;
231 265
232 li { 266 li {
233 float: left; 267 float: left;