Authored by Rock Zhang

Merge branch 'develop' of git.dev.yoho.cn:web/yohobuy into develop

1 -<!DOCTYPE html>  
2 -<html>  
3 -<head>  
4 -<meta charset="utf-8">  
5 -<title>找回密码-通过邮箱 | YOHO!有货</title>  
6 -<meta name="keywords" content="Yoho! 有货官网,潮流志,潮流男装,潮牌,美国潮牌,日本潮牌,香港潮牌,潮牌店,新品首发,欧美潮流,全球购,代购,时尚,流行,特卖,B2C,正品,购物网站,网上购物,货到付款">  
7 -<meta name="description" content="YOHO! 有货,年轻人潮流购物中心,中国最大的潮流商品购物网站。100%品牌正品保证,支持货到付款。作为YOHO!旗下的购物平台,汇集了全球潮流时尚商品和中国最流行的商品,也是国内最大的原创文化商品平台,也是香港,台湾地区流行商品的集中地。同时包含日本、韩国等众多国外潮流品牌,带给您全新潮流购物体验。">  
8 -<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">  
9 -<meta http-equiv="cleartype" content="on">  
10 -<meta name="apple-mobile-web-app-status-bar-style" content="black" />  
11 -<meta content="telephone=no" name="format-detection" />  
12 -<meta content="email=no" name="format-detection" />  
13 -<script type="text/javascript">  
14 - (function(doc, win) {  
15 - var docEl = doc.documentElement;  
16 - (function() {  
17 - var clientWidth = docEl.clientWidth;  
18 - if (!clientWidth) {  
19 - return;  
20 - }  
21 - docEl.style.fontSize = 20 * (clientWidth / 320) + 'px';  
22 - }());  
23 - })(document, window);  
24 -</script>  
25 -<link rel="stylesheet" href="http://cdn.yoho.cn/myohobuy/0.0.2/index.css">  
26 -</head>  
27 -<body class=passport-body>  
28 - <div class="back-email-page passport-page yoho-page">  
29 - <div class="header">  
30 - <a class="go-back" href=/signin.html></a>  
31 - <p class="title">找回密码</p>  
32 - </div> <div class="content">  
33 - <div class="input-container row has-clear">  
34 - <input id="email" class="input email" type="text" placeholder="请输入邮箱" autocomplete="off">  
35 - </div>  
36 - <span id="btn-sure" class="btn btn-sure disable row">确定</span>  
37 - </div>  
38 -</div>  
39 -<script src="http://cdn.yoho.cn/myohobuy/0.0.2/lib.js"></script>  
40 -<script src="http://cdn.yoho.cn/myohobuy/0.0.2/index.js"></script>  
41 -<script>  
42 - seajs.use('js/common');  
43 -</script>  
44 -<script>  
45 - seajs.use('js/passport/back/email');  
46 -</script>  
47 -</body>  
48 -</html>  
1 -<!DOCTYPE html>  
2 -<html>  
3 -<head>  
4 -<meta charset="utf-8">  
5 -<title>国际账号登录 | YOHO!有货</title>  
6 -<meta name="keywords" content="Yoho! 有货官网,潮流志,潮流男装,潮牌,美国潮牌,日本潮牌,香港潮牌,潮牌店,新品首发,欧美潮流,全球购,代购,时尚,流行,特卖,B2C,正品,购物网站,网上购物,货到付款">  
7 -<meta name="description" content="YOHO! 有货,年轻人潮流购物中心,中国最大的潮流商品购物网站。100%品牌正品保证,支持货到付款。作为YOHO!旗下的购物平台,汇集了全球潮流时尚商品和中国最流行的商品,也是国内最大的原创文化商品平台,也是香港,台湾地区流行商品的集中地。同时包含日本、韩国等众多国外潮流品牌,带给您全新潮流购物体验。">  
8 -<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">  
9 -<meta http-equiv="cleartype" content="on">  
10 -<meta name="apple-mobile-web-app-status-bar-style" content="black" />  
11 -<meta content="telephone=no" name="format-detection" />  
12 -<meta content="email=no" name="format-detection" />  
13 -<script type="text/javascript">  
14 - (function(doc, win) {  
15 - var docEl = doc.documentElement;  
16 - (function() {  
17 - var clientWidth = docEl.clientWidth;  
18 - if (!clientWidth) {  
19 - return;  
20 - }  
21 - docEl.style.fontSize = 20 * (clientWidth / 320) + 'px';  
22 - }());  
23 - })(document, window);  
24 -</script>  
25 -<link rel="stylesheet" href="http://cdn.yoho.cn/myohobuy/0.0.2/index.css">  
26 -</head>  
27 -<body class=passport-body>  
28 - <div class="login-international-page passport-page yoho-page">  
29 - <div class="header">  
30 - <a class="go-back" href=/></a>  
31 - <p class="title">登录</p>  
32 - </div> <div class="content">  
33 - <div class="select-container row">  
34 - <span class="select-title">国家和地区</span>  
35 - <select id="country-select" class="country-select select in-android-uc">  
36 - <option value=+61 >澳大利亚</option>  
37 - <option value=+82 >韩国</option>  
38 - <option value=+1 >加拿大</option>  
39 - <option value=+60 >马来西亚</option>  
40 - <option value=+1 >美国</option>  
41 - <option value=+81 >日本</option>  
42 - <option value=+65 >新加坡</option>  
43 - <option value=+44 >英国</option>  
44 - <option value=+86 selected>中国</option>  
45 - <option value=+853 >中国澳门</option>  
46 - <option value=+886 >中国台湾</option>  
47 - <option value=+852 >中国香港</option>  
48 - </select>  
49 - <div class="arrow-right"></div>  
50 - </div> <div class="input-container phone-container row has-clear">  
51 - <span id="area-code" class="area-code">+86</span>  
52 - <input id="phone-num" class="input phone-num" type="text" placeholder="手机号" value=>  
53 - </div>  
54 - <div class="input-container row has-eye">  
55 - <input id="pwd" class="pwd input" type="password" placeholder="密码">  
56 - </div>  
57 - <span id="btn-login" class="btn btn-login disble row">登录</span>  
58 - </div>  
59 -</div>  
60 -<script src="http://cdn.yoho.cn/myohobuy/0.0.2/lib.js"></script>  
61 -<script src="http://cdn.yoho.cn/myohobuy/0.0.2/index.js"></script>  
62 -<script>  
63 - seajs.use('js/common');  
64 -</script>  
65 - <script>  
66 - seajs.use('js/passport/login/international');  
67 - </script>  
68 -</body>  
69 -</html>  
1 -<!DOCTYPE html>  
2 -<html>  
3 -<head>  
4 -<meta charset="utf-8">  
5 -<title>找回密码-通过手机号 | YOHO!有货</title>  
6 -<meta name="keywords" content="Yoho! 有货官网,潮流志,潮流男装,潮牌,美国潮牌,日本潮牌,香港潮牌,潮牌店,新品首发,欧美潮流,全球购,代购,时尚,流行,特卖,B2C,正品,购物网站,网上购物,货到付款">  
7 -<meta name="description" content="YOHO! 有货,年轻人潮流购物中心,中国最大的潮流商品购物网站。100%品牌正品保证,支持货到付款。作为YOHO!旗下的购物平台,汇集了全球潮流时尚商品和中国最流行的商品,也是国内最大的原创文化商品平台,也是香港,台湾地区流行商品的集中地。同时包含日本、韩国等众多国外潮流品牌,带给您全新潮流购物体验。">  
8 -<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">  
9 -<meta http-equiv="cleartype" content="on">  
10 -<meta name="apple-mobile-web-app-status-bar-style" content="black" />  
11 -<meta content="telephone=no" name="format-detection" />  
12 -<meta content="email=no" name="format-detection" />  
13 -<script type="text/javascript">  
14 - (function(doc, win) {  
15 - var docEl = doc.documentElement;  
16 - (function() {  
17 - var clientWidth = docEl.clientWidth;  
18 - if (!clientWidth) {  
19 - return;  
20 - }  
21 - docEl.style.fontSize = 20 * (clientWidth / 320) + 'px';  
22 - }());  
23 - })(document, window);  
24 -</script>  
25 -<link rel="stylesheet" href="http://cdn.yoho.cn/myohobuy/0.0.2/index.css">  
26 -</head>  
27 -<body class=passport-body>  
28 - <div class="back-mobile-page passport-page yoho-page">  
29 - <div class="header">  
30 - <a class="go-back" href=/signin.html></a>  
31 - <p class="title">找回密码</p>  
32 - </div> <div class="content">  
33 - <div class="select-container row">  
34 - <span class="select-title">国家和地区</span>  
35 - <select id="country-select" class="country-select select in-android-uc">  
36 - <option value=+61 >澳大利亚</option>  
37 - <option value=+82 >韩国</option>  
38 - <option value=+1 >加拿大</option>  
39 - <option value=+60 >马来西亚</option>  
40 - <option value=+1 >美国</option>  
41 - <option value=+81 >日本</option>  
42 - <option value=+65 >新加坡</option>  
43 - <option value=+44 >英国</option>  
44 - <option value=+86 selected>中国</option>  
45 - <option value=+853 >中国澳门</option>  
46 - <option value=+886 >中国台湾</option>  
47 - <option value=+852 >中国香港</option>  
48 - </select>  
49 - <div class="arrow-right"></div>  
50 - </div> <div class="input-container phone-container row has-clear">  
51 - <span id="area-code" class="area-code"></span>  
52 - <input id="phone-num" class="input phone-num" type="text" placeholder="手机号">  
53 - </div>  
54 - <span id="btn-next" class="btn btn-next disable row">下一步</span>  
55 - </div>  
56 -</div>  
57 -<script src="http://cdn.yoho.cn/myohobuy/0.0.2/lib.js"></script>  
58 -<script src="http://cdn.yoho.cn/myohobuy/0.0.2/index.js"></script>  
59 -<script>  
60 - seajs.use('js/common');  
61 -</script>  
62 -<script>  
63 - seajs.use('js/passport/back/mobile');  
64 -</script>  
65 -</body>  
66 -</html>  
1 -<!DOCTYPE html>  
2 -<html>  
3 -<head>  
4 -<meta charset="utf-8">  
5 -<title>注册 | YOHO!有货</title>  
6 -<meta name="keywords" content="Yoho! 有货官网,潮流志,潮流男装,潮牌,美国潮牌,日本潮牌,香港潮牌,潮牌店,新品首发,欧美潮流,全球购,代购,时尚,流行,特卖,B2C,正品,购物网站,网上购物,货到付款">  
7 -<meta name="description" content="YOHO! 有货,年轻人潮流购物中心,中国最大的潮流商品购物网站。100%品牌正品保证,支持货到付款。作为YOHO!旗下的购物平台,汇集了全球潮流时尚商品和中国最流行的商品,也是国内最大的原创文化商品平台,也是香港,台湾地区流行商品的集中地。同时包含日本、韩国等众多国外潮流品牌,带给您全新潮流购物体验。">  
8 -<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">  
9 -<meta http-equiv="cleartype" content="on">  
10 -<meta name="apple-mobile-web-app-status-bar-style" content="black" />  
11 -<meta content="telephone=no" name="format-detection" />  
12 -<meta content="email=no" name="format-detection" />  
13 -<script type="text/javascript">  
14 - (function(doc, win) {  
15 - var docEl = doc.documentElement;  
16 - (function() {  
17 - var clientWidth = docEl.clientWidth;  
18 - if (!clientWidth) {  
19 - return;  
20 - }  
21 - docEl.style.fontSize = 20 * (clientWidth / 320) + 'px';  
22 - }());  
23 - })(document, window);  
24 -</script>  
25 -<link rel="stylesheet" href="http://cdn.yoho.cn/myohobuy/0.0.2/index.css">  
26 -</head>  
27 -<body class=passport-body>  
28 - <div class="reg-page passport-page yoho-page">  
29 - <div class="header">  
30 - <a class="go-back" href=/></a>  
31 - <p class="title">注册</p>  
32 - </div> <div class="content">  
33 - <div class="select-container row">  
34 - <span class="select-title">国家和地区</span>  
35 - <select id="country-select" class="country-select select in-android-uc">  
36 - <option value=+61 >澳大利亚</option>  
37 - <option value=+82 >韩国</option>  
38 - <option value=+1 >加拿大</option>  
39 - <option value=+60 >马来西亚</option>  
40 - <option value=+1 >美国</option>  
41 - <option value=+81 >日本</option>  
42 - <option value=+65 >新加坡</option>  
43 - <option value=+44 >英国</option>  
44 - <option value=+86 selected>中国</option>  
45 - <option value=+853 >中国澳门</option>  
46 - <option value=+886 >中国台湾</option>  
47 - <option value=+852 >中国香港</option>  
48 - </select>  
49 - <div class="arrow-right"></div>  
50 - </div> <div class="input-container phone-container row has-clear">  
51 - <span id="area-code" class="area-code">+86</span>  
52 - <input id="phone-num" class="input phone-num" type="text" placeholder="手机号">  
53 - </div>  
54 - <span id="btn-next" class="btn btn-next disable row">下一步</span>  
55 - <p class="register-tip">YOHO!Family账号可登录YOHO!有货、YOHO!Boys、YOHO!Girls及SHOW</p>  
56 - </div>  
57 -</div>  
58 -<script src="http://cdn.yoho.cn/myohobuy/0.0.2/lib.js"></script>  
59 -<script src="http://cdn.yoho.cn/myohobuy/0.0.2/index.js"></script>  
60 -<script>  
61 - seajs.use('js/common');  
62 -</script>  
63 -<script>  
64 - seajs.use('js/passport/register/register');  
65 -</script>  
66 -</body>  
67 -</html>  
1 -<!DOCTYPE html>  
2 -<html>  
3 -<head>  
4 -<meta charset="utf-8">  
5 -<title>登录 | YOHO!有货</title>  
6 -<meta name="keywords" content="Yoho! 有货官网,潮流志,潮流男装,潮牌,美国潮牌,日本潮牌,香港潮牌,潮牌店,新品首发,欧美潮流,全球购,代购,时尚,流行,特卖,B2C,正品,购物网站,网上购物,货到付款">  
7 -<meta name="description" content="YOHO! 有货,年轻人潮流购物中心,中国最大的潮流商品购物网站。100%品牌正品保证,支持货到付款。作为YOHO!旗下的购物平台,汇集了全球潮流时尚商品和中国最流行的商品,也是国内最大的原创文化商品平台,也是香港,台湾地区流行商品的集中地。同时包含日本、韩国等众多国外潮流品牌,带给您全新潮流购物体验。">  
8 -<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">  
9 -<meta http-equiv="cleartype" content="on">  
10 -<meta name="apple-mobile-web-app-status-bar-style" content="black" />  
11 -<meta content="telephone=no" name="format-detection" />  
12 -<meta content="email=no" name="format-detection" />  
13 -<script type="text/javascript">  
14 - (function(doc, win) {  
15 - var docEl = doc.documentElement;  
16 - (function() {  
17 - var clientWidth = docEl.clientWidth;  
18 - if (!clientWidth) {  
19 - return;  
20 - }  
21 - docEl.style.fontSize = 20 * (clientWidth / 320) + 'px';  
22 - }());  
23 - })(document, window);  
24 -</script>  
25 -<link rel="stylesheet" href="http://cdn.yoho.cn/myohobuy/0.0.2/index.css">  
26 -</head>  
27 -<body class=passport-body>  
28 - <div class="login-page passport-page yoho-page">  
29 - <div class="header">  
30 - <a class="go-back" href=/></a>  
31 - <div class="img-header"></div>  
32 - </div> <div class="content">  
33 - <div class="acc-container input-container row has-clear">  
34 - <div class="yoho-logo"></div>  
35 - <input id="account" class="input account" type="text" placeholder="手机号/邮箱" autocomplete="off" value=>  
36 - </div>  
37 - <div class="input-container row has-eye">  
38 - <input id="pwd" class="pwd input" type="password" placeholder="密码">  
39 - </div>  
40 - <span id="btn-login" class="btn btn-login disable">登录</span>  
41 - <p class="op-container">  
42 - <a class="go-register" href=/reg.html>免费注册</a>  
43 - <span id="forget-pwd" class="forget-pwd">忘记密码</span>  
44 - </p>  
45 - <div class="third-party-login">  
46 - <span>其他登录方式</span>  
47 - <div class="tp-link">  
48 - <a class="alipay" href=/passport/login/alipay></a>  
49 - <a class="weibo" href=/passport/login/sina></a>  
50 - <a class="qq" href=/passport/login/qq></a>  
51 - </div>  
52 - </div>  
53 - <a class="international" href=/login.html>International Customer</a>  
54 - <div class="login-tip">  
55 - <div class="info-icon"></div>  
56 - Yoho!Family账号可登录YOHO!有货  
57 - </div>  
58 - <div id="retrive-pwd-mask" class="mask"></div>  
59 - <ul id="retrive-pwd-ways" class="retrive-pwd-ways">  
60 - <li>  
61 - <a href=/passport/back/mobile>通过手机找回密码</a>  
62 - </li>  
63 - <li>  
64 - <a href=/passport/back/email>通过邮箱找回密码</a>  
65 - </li>  
66 - <li id="cancel-retrive">  
67 - 取消  
68 - </li>  
69 - </ul>  
70 - </div>  
71 -</div>  
72 -<script src="http://cdn.yoho.cn/myohobuy/0.0.2/lib.js"></script>  
73 -<script src="http://cdn.yoho.cn/myohobuy/0.0.2/index.js"></script>  
74 -<script>  
75 - seajs.use('js/common');  
76 -</script>  
77 -<script>  
78 - seajs.use('js/passport/login/login');  
79 -</script>  
80 -</body>  
81 -</html>  
@@ -98,7 +98,7 @@ gulp.task('compass-production', ['assets'], function() { @@ -98,7 +98,7 @@ gulp.task('compass-production', ['assets'], function() {
98 compass({ 98 compass({
99 css: distDir.css, 99 css: distDir.css,
100 sass: 'sass', 100 sass: 'sass',
101 - image: distDir.image, 101 + image: distDir.img,
102 font: distDir.font, 102 font: distDir.font,
103 http_path: '/', 103 http_path: '/',
104 style: 'compressed' 104 style: 'compressed'
1 /** 1 /**
2 - * 分类  
3 - * @author: xuqi<qi.xu@yoho.cn>  
4 - * @date: 2015/10/14 2 + * 品牌一览
  3 + * @author: liangzhifeng<zhifeng.liang@yoho.cn>
  4 + * @date: 2015/10/23
5 */ 5 */
6 6
7 var $ = require('yoho.zepto'), 7 var $ = require('yoho.zepto'),
  1 +/**
  2 + * 折扣专区
  3 + * @author: liangzhifeng<zhifeng.liang@yoho.cn>
  4 + * @date: 2015/10/23
  5 + */
  6 +
1 var $ = require('yoho.zepto'), 7 var $ = require('yoho.zepto'),
2 - Swiper = require('yoho.iswiper'),  
3 lazyLoad = require('yoho.zeptolazyload'); 8 lazyLoad = require('yoho.zeptolazyload');
4 9
5 -var $curNav,  
6 - $navList = $('#discount-nav'),  
7 - $newArrivalList = $('#discount-goods-list'),  
8 - $goods = $newArrivalList.children('.goods-list'),  
9 - $goodList = $('.goods-list');  
10 -  
11 -var swiper;  
12 -var index = 0,  
13 - winH = $(window).height(),  
14 - loadMoreH = $('#load-more').height(),  
15 - loading = false,  
16 - page = 0,  
17 - pd = "";  
18 -  
19 -swiper = new Swiper('.swiper-container', {  
20 - lazyLoading: true,  
21 - pagination: '.swiper-pagination'  
22 -}); 10 +var filter = require('../../plugin/filter');
23 11
24 -lazyLoad($('img.lazy'));  
25 -$curNav = $navList.children('.focus'); 12 +var $goodsContainer = $('#goods-container'),
  13 + $ngc = $($goodsContainer.children().get(0)),
  14 + $pgc = $($goodsContainer.children().get(1)),
  15 + $dgc = $($goodsContainer.children().get(2));
  16 + $all = $($goodsContainer.children().get(3));
26 17
27 -$('#discount-nav').delegate('li', 'touchstart', function() {  
28 - var $this = $(this),  
29 - $content; 18 +var winH = $(window).height();
30 19
31 - if ($this.hasClass('focus')) {  
32 - return; 20 +//默认筛选条件
  21 +var defaultOpt = {
  22 + gender: $('#gender').val(),
  23 + brand: $('#brand').val(),
  24 + msort: $('#msort').val(),
  25 + color: $('#color').val(),
  26 + size: $('#size').val(),
  27 + price: $('#price').val(),
  28 + discount: $('#discount').val(),
  29 + limit: $('#limit').val(),
  30 + dayLimit: $('#dayLimit').val(),
  31 + channel: $('#channel').val(),
  32 + p_d: $('#p_d').val()
  33 +};
  34 +
  35 +var $listNav = $('#list-nav'),
  36 +
  37 + //导航数据信息
  38 + navInfo = {
  39 + today: {
  40 + reload: true,
  41 + page: 0,
  42 + end: false
  43 + },
  44 + week: {
  45 + reload: true,
  46 + page: 0,
  47 + end: false
  48 + },
  49 + sale: {
  50 + reload: true,
  51 + page: 0,
  52 + end: false
  53 + },
  54 + all: {
  55 + reload: true,
  56 + page: 0,
  57 + end: false
33 } 58 }
  59 + },
  60 + $pre, //纪录进入筛选前的active项
  61 + searching;
34 62
35 - index = $this.index();  
36 - pd = getSalePdByChoose(index); 63 +$pgc.addClass('hide');
  64 +$dgc.addClass('hide');
  65 +$all.addClass('hide');
37 66
38 - $this.addClass('focus');  
39 - $curNav.removeClass('focus'); 67 +/**
  68 + * 筛选注册的回调,筛选子项点击后逻辑
  69 + * 需要执行search的场景:1.点选筛选项;2.relaod为true时切换导航;3.下拉加载
  70 + * @param opt {type, id}
  71 + */
  72 +function search(opt) {
  73 + var setting = {},
  74 + ext,
  75 + att,
  76 + nav, navType,
  77 + dayLimit,
  78 + page;
  79 +
  80 + if (opt) {
40 81
41 - $goods.not('.hide').addClass('hide');  
42 - $content = $goods.eq(index);  
43 - $content.removeClass('hide'); 82 + //筛选项变更则重置reload为true
  83 + for (att in navInfo) {
  84 + if (navInfo.hasOwnProperty(att)) {
  85 + navInfo[att].reload = true;
  86 + }
  87 + }
44 88
45 - $curNav = $this; 89 + //处理active状态
  90 + $listNav.children('.active').removeClass('active');
  91 + $pre.addClass('active');
46 92
47 - $(document).trigger('scroll'); //Trigger lazyLoad  
48 -}); 93 + switch (opt.type) {
  94 + case 'gender':
  95 + ext = {
  96 + gender: opt.id
  97 + };
  98 + break;
  99 + case 'brand':
  100 + ext = {
  101 + brand: opt.id
  102 + };
  103 + break;
  104 + case 'msort':
  105 + ext = {
  106 + msort: opt.id
  107 + };
  108 + break;
  109 + case 'color':
  110 + ext = {
  111 + color: opt.id
  112 + };
  113 + break;
  114 + case 'size':
  115 + ext = {
  116 + size: opt.id
  117 + };
  118 + break;
  119 + case 'price':
  120 + ext = {
  121 + price: opt.id
  122 + };
  123 + break;
  124 + case 'discount':
  125 + ext = {
  126 + discount: opt.id
  127 + };
  128 + break;
  129 + case 'limit':
  130 + ext = {
  131 + limit: opt.id
  132 + };
  133 + break;
  134 + case 'channel':
  135 + ext = {
  136 + channel: opt.id
  137 + };
  138 + break;
  139 + case 'p_d':
  140 + ext = {
  141 + p_d: opt.id
  142 + };
  143 + break;
  144 + }
  145 +
  146 + $.extend(defaultOpt, ext); //扩展筛选项
  147 + }
  148 +
  149 + if (searching) {
  150 + return;
  151 + }
  152 +
  153 + //导航类别
  154 + if ($pre === undefined || $pre.hasClass('today')) {
  155 + navType = 'today';
  156 + dayLimit = 1;
  157 + } else if ($pre.hasClass('week')) {
  158 + navType = 'week';
  159 + dayLimit = 2;
  160 + } else if ($pre.hasClass('sale')) {
  161 + navType = 'sale';
  162 + dayLimit = 3;
  163 + }else if ($pre.hasClass('all')) {
  164 + navType = 'all';
  165 + dayLimit = 4;
  166 + }
49 167
50 -//srcoll to load more  
51 -$(window).scroll(function () {  
52 - if ($(window).scrollTop() + winH >= $(document).height() - loadMoreH) {  
53 - if (loading) { 168 + nav = navInfo[navType];
  169 +
  170 + page = nav.page + 1;
  171 + if (nav.reload) {
  172 + page = 1;
  173 + } else if (nav.end) {
  174 +
  175 + //不需要重新加载并且数据请求结束
54 return; 176 return;
55 } 177 }
56 - loading = true;  
57 178
58 - // num = $goodList.children('.good-info').length; 179 + $.extend(setting, defaultOpt, {
  180 + dayLimit: dayLimit,
  181 + page: page
  182 + });
  183 +
  184 + searching = true;
  185 +
59 $.ajax({ 186 $.ajax({
60 type: 'GET', 187 type: 'GET',
61 url: '/product/newsale/selectNewSale', 188 url: '/product/newsale/selectNewSale',
62 - data: {  
63 - p_d: pd,  
64 - page: page + 1  
65 - }, 189 + data: setting,
66 success: function(data) { 190 success: function(data) {
  191 + var noResult = '<p class="no-result">未找到相关搜索结果</p>',
  192 + $container;
  193 +
  194 + switch (navType) {
  195 + case 'today':
  196 + $container = $ngc;
  197 + break;
  198 + case 'week':
  199 + $container = $pgc;
  200 + break;
  201 + case 'sale':
  202 + $container = $dgc;
  203 + break;
  204 + case 'all':
  205 + $container = $all;
  206 + break;
  207 + }
  208 +
67 if (data === ' ') { 209 if (data === ' ') {
  210 + nav.end = true;
68 211
69 - //opt.end = true;  
70 - loading = false;  
71 - return; 212 + if (nav.reload) {
  213 + $container.html(noResult);
  214 + }
  215 + } else {
  216 + if (nav.reload) {
  217 + $container.html(data);
  218 + } else {
  219 + $container.append(data);
72 } 220 }
73 221
74 - $goodList.append(data); 222 + lazyLoad($container.find('.lazy'));
  223 + }
75 224
76 - //lazyLoad  
77 - //lazyLoad($goodList.children('.good-info:gt(' + (num - 1) + ')').find('img.lazy'));  
78 - lazyLoad($('.good-info').find('img.lazy')); 225 + nav.reload = false;
  226 + nav.page = page;
79 227
80 - loading = false;  
81 - page++;  
82 - },  
83 - error: function() {  
84 - tip.show('网络断开连接了~');  
85 - loading = false; 228 + searching = false;
86 } 229 }
87 }); 230 });
  231 +
  232 +}
  233 +
  234 +lazyLoad($('.lazy'));
  235 +
  236 +filter.registerCbFn(search);
  237 +
  238 +//导航栏点击逻辑说明:
  239 +//1.点击非active项时切换active状态
  240 +//2.价格和折扣active状态时继续点击切换排序
  241 +//3.筛选无active时点击展开筛选面板
  242 +//4.筛选有active时点击隐藏筛选面板并恢复点击筛选前active项的active状态
  243 +//5.当前active为筛选并且点击其他项时,隐藏筛选面板
  244 +$listNav.delegate('li', 'touchstart', function() {
  245 + var $this = $(this),
  246 + nav,
  247 + navType,
  248 + $active;
  249 +
  250 + if ($this.hasClass('filter')) {
  251 +
  252 + //筛选面板切换状态
  253 + if ($this.hasClass('active')) {
  254 + filter.hideFilter();
  255 +
  256 + //点击筛选钱的active项回复active
  257 + $pre.addClass('active');
  258 + $this.removeClass('active');
  259 + } else {
  260 + $pre = $this.siblings('.active');
  261 +
  262 + $pre.removeClass('active');
  263 + $this.addClass('active');
  264 +
  265 + filter.showFilter();
88 } 266 }
  267 + } else {
89 268
90 -}); 269 + if ($this.hasClass('new')) {
  270 + navType = 'newest';
  271 + } else if ($this.hasClass('price')) {
  272 + navType = 'price';
  273 + } else if ($this.hasClass('discount')) {
  274 + navType = 'discount';
  275 + }
91 276
92 -/**  
93 - * 根据用户的选择获取商品折扣值  
94 - *  
95 - * @param int index  
96 - * @return string  
97 - */  
98 -function getSalePdByChoose(index) {  
99 - var pd = "0.1,0.3";  
100 - switch (index) {  
101 - case 0:  
102 - pd = "0.1,0.3"; 277 + nav = navInfo[navType];
  278 +
  279 + if ($this.hasClass('active')) {
  280 +
  281 + //最新无排序切换
  282 + if ($this.hasClass('new')) {
  283 + return;
  284 + }
  285 +
  286 + if ($this.hasClass('price') || $this.hasClass('discount')) {
  287 +
  288 + // 价格/折扣切换排序状态
  289 + $this.find('.icon > .iconfont').toggleClass('cur');
  290 + $pre = $this; //更新pre为当前项
  291 + nav.reload = true; //重置reload,HTML会被替换为逆序的HTML
  292 + nav.order = nav.order === 0 ? 1 : 0; //切换排序
  293 + }
  294 + } else {
  295 + $active = $this.siblings('.active');
  296 +
  297 + $pre = $this; //$pre为除筛选导航的其他导航项,若当前active的为筛选,则把$pre置为当前点击项
  298 +
  299 + if ($active.hasClass('filter')) {
  300 +
  301 + //若之前active项为筛选,则隐藏筛选面板
  302 + filter.hideFilter();
  303 + } else {
  304 +
  305 + //切换container显示
  306 + $goodsContainer.children('.container:not(.hide)').addClass('hide');
  307 +
  308 + switch (navType) {
  309 + case 'newest':
  310 + $ngc.removeClass('hide');
103 break; 311 break;
104 - case 1:  
105 - pd = "0.4,0.6"; 312 +
  313 + case 'price':
  314 + $pgc.removeClass('hide');
106 break; 315 break;
107 - case 2:  
108 - pd = "0.7,0.9"; 316 +
  317 + case 'discount':
  318 + $dgc.removeClass('hide');
109 break; 319 break;
110 - case 3:  
111 - pd = "0.1,0.9"; 320 +
  321 + case 'all':
  322 + $dgc.removeClass('hide');
112 break; 323 break;
113 } 324 }
114 - return pd;  
115 -}  
  325 + }
  326 +
  327 + $active.removeClass('active');
  328 + $this.addClass('active');
  329 + }
  330 +
  331 + if (nav.reload) {
  332 + search();
  333 + }
  334 + }
  335 +});
  336 +
  337 +$(window).scroll(function() {
  338 +
  339 + //当scroll到1/4$goodsContainer高度后继续请求下一页数据
  340 + if ($(window).scrollTop() + winH >
  341 + $(document).height() - 0.25 * $goodsContainer.height()) {
  342 + search();
  343 + }
  344 +});
1 /** 1 /**
2 - * 商品列表页  
3 - * @author: xuqi<qi.xu@yoho.cn>  
4 - * @date: 2015/10/20 2 + * 新品到着
  3 + * @author: liangzhifeng<zhifeng.liang@yoho.cn>
  4 + * @date: 2015/10/24
5 */ 5 */
6 6
7 var $ = require('yoho.zepto'), 7 var $ = require('yoho.zepto'),
@@ -144,7 +144,7 @@ function search(opt) { @@ -144,7 +144,7 @@ function search(opt) {
144 } 144 }
145 145
146 //导航类别 146 //导航类别
147 - if ($pre.hasClass('today')) { 147 + if ($pre === undefined || $pre.hasClass('today')) {
148 navType = 'today'; 148 navType = 'today';
149 dayLimit = 1; 149 dayLimit = 1;
150 } else if ($pre.hasClass('week')) { 150 } else if ($pre.hasClass('week')) {
@@ -265,17 +265,6 @@ $listNav.delegate('li', 'touchstart', function() { @@ -265,17 +265,6 @@ $listNav.delegate('li', 'touchstart', function() {
265 265
266 if ($this.hasClass('active')) { 266 if ($this.hasClass('active')) {
267 267
268 - //最新无排序切换  
269 - if ($this.hasClass('today')) {  
270 - return;  
271 - }  
272 -  
273 - if ($this.hasClass('week') || $this.hasClass('sale')) {  
274 -  
275 - // 价格/折扣切换排序状态  
276 - $pre = $this; //更新pre为当前项  
277 - nav.reload = true; //重置reload,HTML会被替换为逆序的HTML  
278 - }  
279 } else { 268 } else {
280 $active = $this.siblings('.active'); 269 $active = $this.siblings('.active');
281 270
@@ -320,6 +309,8 @@ $(window).scroll(function() { @@ -320,6 +309,8 @@ $(window).scroll(function() {
320 //当scroll到1/4$goodsContainer高度后继续请求下一页数据 309 //当scroll到1/4$goodsContainer高度后继续请求下一页数据
321 if ($(window).scrollTop() + winH > 310 if ($(window).scrollTop() + winH >
322 $(document).height() - 0.25 * $goodsContainer.height()) { 311 $(document).height() - 0.25 * $goodsContainer.height()) {
  312 + if($pre){
323 search(); 313 search();
324 } 314 }
  315 + }
325 }); 316 });
@@ -89,7 +89,7 @@ body.passport-body { @@ -89,7 +89,7 @@ body.passport-body {
89 height: 20px; 89 height: 20px;
90 right: 15px; 90 right: 15px;
91 top: 16px; 91 top: 16px;
92 - background-image: url('http://static.dev.yohobuy.com/img/passport/arrow-right.png'); 92 + background: image-url('passport/arrow-right.png') no-repeat;
93 background-size: 100% 100%; 93 background-size: 100% 100%;
94 } 94 }
95 } 95 }
@@ -144,7 +144,7 @@ body.passport-body { @@ -144,7 +144,7 @@ body.passport-body {
144 right: 10px; 144 right: 10px;
145 width: 16px; 145 width: 16px;
146 height: 16px; 146 height: 16px;
147 - background-image: url('http://static.dev.yohobuy.com/img/passport/clear-input.png'); 147 + background: image-url('passport/clear-input.png') no-repeat;
148 background-size: 100% 100%; 148 background-size: 100% 100%;
149 } 149 }
150 150
@@ -154,11 +154,11 @@ body.passport-body { @@ -154,11 +154,11 @@ body.passport-body {
154 right: 10px; 154 right: 10px;
155 width: 19px; 155 width: 19px;
156 height: 12px; 156 height: 12px;
157 - background-image: url('http://static.dev.yohobuy.com/img/passport/eye.png'); 157 + background: image-url('passport/eye.png') no-repeat;
158 background-size: 100% 100%; 158 background-size: 100% 100%;
159 159
160 &.close { 160 &.close {
161 - background-image: url('http://static.dev.yohobuy.com/img/passport/eye-close.png'); 161 + background-image: image-url('passport/eye-close.png');
162 } 162 }
163 } 163 }
164 164
@@ -31,12 +31,18 @@ @@ -31,12 +31,18 @@
31 <div id="goods-container" class="goods-container"> 31 <div id="goods-container" class="goods-container">
32 {{# goodsContainer}} 32 {{# goodsContainer}}
33 <div class="new-goods container"> 33 <div class="new-goods container">
  34 + {{#if goods}}
34 {{# goods}} 35 {{# goods}}
35 {{> good}} 36 {{> good}}
36 {{/ goods}} 37 {{/ goods}}
  38 + {{^}}
  39 + <p class="no-result">未找到相关搜索结果</p>
  40 + {{/if}}
37 </div> 41 </div>
38 {{/ goodsContainer}} 42 {{/ goodsContainer}}
39 43
  44 +
  45 +
40 {{> filter}} 46 {{> filter}}
41 </div> 47 </div>
42 48
1 -{{>layout/header}}  
2 -<div class="discount-page yoho-page"> 1 +{{> layout/header}}
  2 +<div class="good-list-page yoho-page">
3 {{# headerBanner}} 3 {{# headerBanner}}
4 {{> product/banner_swipe_and_single}} 4 {{> product/banner_swipe_and_single}}
5 {{/ headerBanner}} 5 {{/ headerBanner}}
6 6
7 - <ul id="discount-nav" class="discount-nav clearfix">  
8 - {{# tabs}}  
9 - <li class="discount-nav-item {{#focus}}focus{{/focus}}">{{title}}</li>  
10 - {{/ tabs}} 7 + <ul id="list-nav" class="list-nav clearfix">
  8 + <li class="today active">
  9 + <a href="javascript:void(0);">
  10 + 1-3
  11 + <span class="iconfont cur">&#xe616;</span>
  12 + </a>
  13 + </li>
  14 + <li class="week">
  15 + <a href="javascript:void(0);">
  16 + 4-6
  17 + <span class="icon">
  18 + <i class="iconfont up">&#xe615;</i>
  19 + <i class="iconfont down cur">&#xe616;</i>
  20 + </span>
  21 + </a>
  22 + </li>
  23 + <li class="sale">
  24 + <a href="javascript:void(0);">
  25 + 7-9
  26 + <span class="icon">
  27 + <i class="iconfont up">&#xe615;</i>
  28 + <i class="iconfont down cur">&#xe616;</i>
  29 + </span>
  30 + </a>
  31 + </li>
  32 + <li class="all">
  33 + <a href="javascript:void(0);">
  34 + All
  35 + <span class="icon">
  36 + <i class="iconfont up">&#xe615;</i>
  37 + <i class="iconfont down cur">&#xe616;</i>
  38 + </span>
  39 + </a>
  40 + </li>
  41 + <li class="filter">
  42 + <a href="javascript:void(0);">
  43 + 筛选
  44 + <span class="iconfont">&#xe613;</span>
  45 + </a>
  46 + </li>
11 </ul> 47 </ul>
12 48
13 - <div id="discount-goods-list">  
14 - {{> product/goods_container}} 49 + <div id="goods-container" class="goods-container">
  50 + {{# goodsContainer}}
  51 + <div class="new-goods container">
  52 + {{# goods}}
  53 + {{> good}}
  54 + {{/ goods}}
15 </div> 55 </div>
  56 + {{/ goodsContainer}}
16 57
17 - <div id="load-more-info" class="load-more-info">  
18 - <div class="loading status hide">  
19 - 正在加载...  
20 - </div>  
21 - <span class="no-more status hide">没有更多啦</span> 58 + {{> filter}}
22 </div> 59 </div>
23 60
24 -</div>  
25 -{{>layout/footer}} 61 + {{#if brand}}
  62 + <input id="brand" type="hidden" value={{brand}}>
  63 + {{/if}}
  64 +
  65 + {{#if gender}}
  66 + <input id="gender" type="hidden" value={{gender}}>
  67 + {{/if}}
  68 +
  69 + {{#if msort}}
  70 + <input id="msort" type="hidden" value={{msort}}>
  71 + {{/if}}
  72 +
  73 + {{#if color}}
  74 + <input id="color" type="hidden" value={{color}}>
  75 + {{/if}}
  76 +
  77 + {{#if size}}
  78 + <input id="size" type="hidden" value={{size}}>
  79 + {{/if}}
26 80
  81 + {{#if price}}
  82 + <input id="price" type="hidden" value={{price}}>
  83 + {{/if}}
27 84
  85 + {{#if p_d}}
  86 + <input id="p_d" type="hidden" value={{p_d}}>
  87 + {{/if}}
28 88
  89 + {{#if channel}}
  90 + <input id="channel" type="hidden" value={{channel}}>
  91 + {{/if}}
  92 +
  93 + {{#if dayLimit}}
  94 + <input id="dayLimit" type="hidden" value={{dayLimit}}>
  95 + {{/if}}
  96 +
  97 + {{#if limit}}
  98 + <input id="limit" type="hidden" value={{limit}}>
  99 + {{/if}}
  100 +
  101 + {{#if page}}
  102 + <input id="page" type="hidden" value={{page}}>
  103 + {{/if}}
  104 +
  105 +</div>
  106 +{{> layout/footer}}