fe / yoho-blk · Commits

Go to a project

Authored by yyq
Commit 061b5939cad6ba12074914600be0696a9a2f5bb5 2 parents 513644b1 d598f664

Merge branch 'release/1.0' of git.yoho.cn:fe/yoho-blk into release/1.0

Inline Side-by-side
Showing 10 changed files with 107 additions and 44 deletions
@@ -69,14 +69,16 @@ @@ -69,14 +69,16 @@
69 </div> 69 </div>
70 </div> 70 </div>
71 </div> 71 </div>
72 -  
73 - <div class="related-goods goods">  
74 - {{# relatedGroup}}  
75 - {{> related-goods}}  
76 - {{/ relatedGroup}}  
77 - <span class="left iconfont">&#xe62c;</span>  
78 - <span class="right iconfont">&#xe629;</span> 72 +
  73 + <div class="related-groups">
  74 + <div class="related-goods goods">
  75 + {{# relatedGroup}}
  76 + {{> related-goods}}
  77 + {{/ relatedGroup}}
  78 + </div>
79 </div> 79 </div>
  80 + <span class="left iconfont hide">&#xe62c;</span>
  81 + <span class="right iconfont">&#xe629;</span>
80 </div> 82 </div>
81 {{/ related}} 83 {{/ related}}
82 {{/ content}} 84 {{/ content}}
@@ -107,22 +109,22 @@ @@ -107,22 +109,22 @@
107 </div> 109 </div>
108 110
109 {{# userInfo}} 111 {{# userInfo}}
110 - <div class="user-handle">  
111 - <ul class="clearfix">  
112 - <li id="prise-btn" class="like-status{{# isLike}} liked{{/ isLike}}">  
113 - <a href="javascript:;">  
114 - <i class="iconfont">&#xe60e;</i>  
115 - <span class="like-num">{{likeNum}}</span>  
116 - </a>  
117 - </li>  
118 - <li id="collect-btn" class="sort-collect{{# isCollected}} collected{{/ isCollected}}">  
119 - <a href="javascript:;">  
120 - <i class="iconfont">&#xe619;</i>  
121 - <span>收藏</span>  
122 - </a>  
123 - </li>  
124 - </ul>  
125 - </div> 112 + <div class="user-handle">
  113 + <ul class="clearfix">
  114 + <li id="prise-btn" class="like-status{{# isLike}} liked{{/ isLike}}">
  115 + <a href="javascript:;">
  116 + <i class="iconfont">&#xe60e;</i>
  117 + <span class="like-num">{{likeNum}}</span>
  118 + </a>
  119 + </li>
  120 + <li id="collect-btn" class="sort-collect{{# isCollected}} collected{{/ isCollected}}">
  121 + <a href="javascript:;">
  122 + <i class="iconfont">&#xe619;</i>
  123 + <span>收藏</span>
  124 + </a>
  125 + </li>
  126 + </ul>
  127 + </div>
126 {{/ userInfo}} 128 {{/ userInfo}}
127 129
128 {{> share}} 130 {{> share}}
@@ -140,11 +140,11 @@ const getProductItemData = (params, url, uid) => { @@ -140,11 +140,11 @@ const getProductItemData = (params, url, uid) => {
140 * 获取商品尺寸，颜色，和缩略图 140 * 获取商品尺寸，颜色，和缩略图
141 * @function getProductInfo 141 * @function getProductInfo
142 * @param { Number } productId 商品ID 142 * @param { Number } productId 商品ID
143 - * @param { String } uid 用户ID  
144 * @param { Number } skn 商品skn 143 * @param { Number } skn 商品skn
  144 + * @param { String } uid 用户ID
145 * @return { Object } 接口返回单个商品的基本信息 145 * @return { Object } 接口返回单个商品的基本信息
146 */ 146 */
147 -const getProductInfo = (productId, uid, skn) => { 147 +const getProductInfo = (productId, skn, uid) => {
148 return itemApi.getProductBaseAsync(productId, uid, skn).then(result => { 148 return itemApi.getProductBaseAsync(productId, uid, skn).then(result => {
149 return itemFun.setProductData(result); 149 return itemFun.setProductData(result);
150 }); 150 });
@@ -17,10 +17,14 @@ var $commentList = $commentArea.find('.comments-wrap'), @@ -17,10 +17,14 @@ var $commentList = $commentArea.find('.comments-wrap'),
17 MAX_COMMENTS_WORDS = 100, 17 MAX_COMMENTS_WORDS = 100,
18 $wordCountTip = $('#word-count-tip'), 18 $wordCountTip = $('#word-count-tip'),
19 _alert = dialog.Alert, 19 _alert = dialog.Alert,
20 - tag = $('#tags').find('li').length; 20 + tag = $('#tags').find('li').length,
  21 + leng = $('.goods').find('.good-info').length / 4,
  22 + pag = 0;
21 23
22 require('../plugins/share'); 24 require('../plugins/share');
23 25
  26 +// require('yoho-unslider');
  27 +
24 $('#prise-btn').click(function() { 28 $('#prise-btn').click(function() {
25 var prising = false, 29 var prising = false,
26 url, 30 url,
@@ -192,10 +196,37 @@ if ($('.collocation').find('.good-info').length === 0) { @@ -192,10 +196,37 @@ if ($('.collocation').find('.good-info').length === 0) {
192 196
193 if ($('.goods').find('.good-info').length === 0) { 197 if ($('.goods').find('.good-info').length === 0) {
194 $('.related-group').hide(); 198 $('.related-group').hide();
  199 +} else if ($('.goods').find('.good-info').length < 5) {
  200 + $('.left').hide();
  201 + $('.right').hide();
195 } 202 }
196 203
197 -// $('.left').click(function {  
198 -// $('.goods').animate({ left: '+50px' }, "slow");  
199 -// }) 204 +$('.right').click(function() {
  205 + pag = pag + 1;
  206 +
  207 + if (pag === leng - 1) {
  208 + $('.right').addClass('hide');
  209 + }
  210 +
  211 + if (pag !== 0) {
  212 + $('.left').removeClass('hide');
  213 + }
  214 +
  215 + $('.goods').animate({left: '+=-930px'});
  216 +});
  217 +
  218 +$('.left').click(function() {
  219 + var $goods = $('.goods');
  220 +
  221 + pag = pag - 1;
  222 +
  223 + if (pag === 0) {
  224 + $('.left').addClass('hide');
  225 + }
200 226
201 -// console.log($('.goods').offsetWidth() 227 + if (pag !== leng - 1) {
  228 + $('.right').removeClass('hide');
  229 + }
  230 +
  231 + $goods.animate({left: '+=930px'});
  232 +});
@@ -72,8 +72,8 @@ $(function() { @@ -72,8 +72,8 @@ $(function() {
72 72
73 // 编辑商品颜色和属性 73 // 编辑商品颜色和属性
74 Cart.editColorOrSize( 74 Cart.editColorOrSize(
75 - $this.attr('data-productId'),  
76 - $this.attr('data-productSkn'), 75 + $this.attr('data-productid'),
  76 + $this.attr('data-productskn'),
77 $this.find('.default-color').text(), 77 $this.find('.default-color').text(),
78 $this.find('.default-size').text(), function() { 78 $this.find('.default-size').text(), function() {
79 editable = true; 79 editable = true;
@@ -124,7 +124,6 @@ Cart = { @@ -124,7 +124,6 @@ Cart = {
124 Util.refreshCart(res, function() { 124 Util.refreshCart(res, function() {
125 Stepper.init(); 125 Stepper.init();
126 126
127 - dotName();  
128 if (callback) { 127 if (callback) {
129 return callback(); 128 return callback();
130 } 129 }
@@ -148,7 +147,6 @@ Cart = { @@ -148,7 +147,6 @@ Cart = {
148 if (res.code === 200) { 147 if (res.code === 200) {
149 Util.refreshCart(res, function() { 148 Util.refreshCart(res, function() {
150 Stepper.init(); 149 Stepper.init();
151 - dotName();  
152 }); 150 });
153 } else { 151 } else {
154 new _alert(res.message).show(); 152 new _alert(res.message).show();
@@ -219,7 +217,6 @@ Cart = { @@ -219,7 +217,6 @@ Cart = {
219 success: function(res) { 217 success: function(res) {
220 Util.refreshCart(res, function() { 218 Util.refreshCart(res, function() {
221 Stepper.init(); 219 Stepper.init();
222 - dotName();  
223 220
224 // 显示或者更新删除商品模块 221 // 显示或者更新删除商品模块
225 Cart.showRemovedProducts(products, extraInfos); 222 Cart.showRemovedProducts(products, extraInfos);
@@ -314,7 +311,6 @@ Cart = { @@ -314,7 +311,6 @@ Cart = {
314 success: function(res) { 311 success: function(res) {
315 Util.refreshCart(res, function() { 312 Util.refreshCart(res, function() {
316 Stepper.init(); 313 Stepper.init();
317 - dotName();  
318 314
319 if (callback) { 315 if (callback) {
320 return callback(); 316 return callback();
@@ -334,7 +330,6 @@ Cart = { @@ -334,7 +330,6 @@ Cart = {
334 success: function(res) { 330 success: function(res) {
335 Util.refreshCart(res, function() { 331 Util.refreshCart(res, function() {
336 Stepper.init(); 332 Stepper.init();
337 - dotName();  
338 }); 333 });
339 } 334 }
340 }); 335 });
@@ -11,8 +11,15 @@ @@ -11,8 +11,15 @@
11 position: relative; 11 position: relative;
12 12
13 h4 { 13 h4 {
  14 + height: 18px;
  15 + line-height: 18px;
  16 + padding-right: 10px;
  17 + display: -webkit-box;
14 font-size: 16px; 18 font-size: 16px;
15 font-weight: bold; 19 font-weight: bold;
  20 + overflow: hidden;
  21 + -webkit-line-clamp: 1;
  22 + -webkit-box-orient: vertical;
16 } 23 }
17 24
18 p { 25 p {
@@ -53,7 +53,7 @@ @@ -53,7 +53,7 @@
53 53
54 img { 54 img {
55 width: 1150px; 55 width: 1150px;
56 - height: auto; 56 + height: $sliderHeight;
57 } 57 }
58 } 58 }
59 } 59 }
@@ -79,10 +79,9 @@ @@ -79,10 +79,9 @@
79 border: 1px solid #404040; 79 border: 1px solid #404040;
80 border-left: none; 80 border-left: none;
81 81
82 - * { 82 + p,
  83 + h4 {
83 display: block; 84 display: block;
84 - }  
85 - p {  
86 display: -webkit-box; 85 display: -webkit-box;
87 } 86 }
88 } 87 }
@@ -98,6 +98,10 @@ @@ -98,6 +98,10 @@
98 overflow: hidden; 98 overflow: hidden;
99 position: relative; 99 position: relative;
100 100
  101 + .collocation {
  102 + margin-left: 30px;
  103 + }
  104 +
101 .btn { 105 .btn {
102 position: relative; 106 position: relative;
103 } 107 }
@@ -137,8 +141,21 @@ @@ -137,8 +141,21 @@
137 } 141 }
138 } 142 }
139 143
  144 + .related-group {
  145 + position: relative;
  146 + height: 450px;
  147 + }
  148 +
  149 + .related-groups {
  150 + width: 930px;
  151 + overflow: hidden;
  152 + position: relative;
  153 + height: 420px;
  154 + margin-left: 30px;
  155 + }
  156 +
140 .related-goods { 157 .related-goods {
141 - padding: 60px 0 0 30px; 158 + padding-top: 60px;
142 159
143 .good-info { 160 .good-info {
144 width: 219px; 161 width: 219px;
@@ -173,6 +190,11 @@ @@ -173,6 +190,11 @@
173 .goods { 190 .goods {
174 height: 420px; 191 height: 420px;
175 overflow: hidden; 192 overflow: hidden;
  193 + position: absolute;
  194 +
  195 + .good-info:nth-child(4n) {
  196 + margin-right: 0;
  197 + }
176 } 198 }
177 199
178 .related-brand { 200 .related-brand {
@@ -500,4 +522,8 @@ @@ -500,4 +522,8 @@
500 padding-left: 30px; 522 padding-left: 30px;
501 width: 330px; 523 width: 330px;
502 } 524 }
  525 +
  526 + .hide {
  527 + display: none;
  528 + }
503 } 529 }
@@ -34,11 +34,14 @@ @@ -34,11 +34,14 @@
34 -webkit-box-orient: vertical; 34 -webkit-box-orient: vertical;
35 } 35 }
36 36
37 - .good-name-text:hover,  
38 - .check-detail:hover { 37 + .good-name-text:hover {
39 text-decoration: underline; 38 text-decoration: underline;
40 } 39 }
41 40
  41 + .check-detail:hover {
  42 + @extend .blue;
  43 + }
  44 +
42 .change-tag { 45 .change-tag {
43 margin: 10px auto 0; 46 margin: 10px auto 0;
44 color: #1b1b1b; 47 color: #1b1b1b;