Showing
1 changed file
with
58 additions
and
50 deletions
@@ -16,8 +16,11 @@ var $ = require('jquery'), | @@ -16,8 +16,11 @@ var $ = require('jquery'), | ||
16 | var $chosePanel = $('#chose-panel'), | 16 | var $chosePanel = $('#chose-panel'), |
17 | $num, | 17 | $num, |
18 | $chosed, | 18 | $chosed, |
19 | + $imgsThumb, | ||
19 | 20 | ||
20 | // re = /\d+/, | 21 | // re = /\d+/, |
22 | + | ||
23 | + $leftNum, | ||
21 | leftNum, | 24 | leftNum, |
22 | confirming, | 25 | confirming, |
23 | curColorIndex, | 26 | curColorIndex, |
@@ -26,7 +29,10 @@ var $chosePanel = $('#chose-panel'), | @@ -26,7 +29,10 @@ var $chosePanel = $('#chose-panel'), | ||
26 | hasChooseColor, | 29 | hasChooseColor, |
27 | hasChooseSize, | 30 | hasChooseSize, |
28 | $curSizeBlock, | 31 | $curSizeBlock, |
29 | - $sizeRowList; | 32 | + $sizeRowList, |
33 | + cbFn, | ||
34 | + $allChoseItems, | ||
35 | + $yohoPage= $('.yoho-page'); | ||
30 | 36 | ||
31 | //初始化购物车面板显示 | 37 | //初始化购物车面板显示 |
32 | function init() { | 38 | function init() { |
@@ -35,12 +41,14 @@ function init() { | @@ -35,12 +41,14 @@ function init() { | ||
35 | hasChooseColor = false; | 41 | hasChooseColor = false; |
36 | hasChooseSize = false; | 42 | hasChooseSize = false; |
37 | $curSizeBlock = null; | 43 | $curSizeBlock = null; |
38 | - $sizeRowList = $('.size-list ul'); | 44 | + $imgsThumb = $('.chose-panel').find('.thumb'), |
45 | + $allChoseItems = $('.chose-items'), | ||
46 | + $sizeRowList = $('.size-list ul'), | ||
47 | + $leftNum = $('#left-num') | ||
39 | $firstRow = $sizeRowList.eq(0); | 48 | $firstRow = $sizeRowList.eq(0); |
40 | $firstRow.toggleClass('hide'); | 49 | $firstRow.toggleClass('hide'); |
41 | $curSizeRow = $firstRow; | 50 | $curSizeRow = $firstRow; |
42 | } | 51 | } |
43 | -init(); | ||
44 | 52 | ||
45 | function checkColorSizeNum() { | 53 | function checkColorSizeNum() { |
46 | if (!hasChooseColor && !hasChooseSize) { | 54 | if (!hasChooseColor && !hasChooseSize) { |
@@ -56,32 +64,34 @@ function checkColorSizeNum() { | @@ -56,32 +64,34 @@ function checkColorSizeNum() { | ||
56 | return true; | 64 | return true; |
57 | } | 65 | } |
58 | 66 | ||
59 | -function show(html) { | 67 | +function show(html, cb) { |
60 | if (html) { | 68 | if (html) { |
61 | $chosePanel.html(html); | 69 | $chosePanel.html(html); |
62 | init(); | 70 | init(); |
63 | } | 71 | } |
64 | $('.chose-panel').show(); | 72 | $('.chose-panel').show(); |
65 | 73 | ||
66 | - $('body').css('overflow', 'hidden'); | 74 | + //$('body').css('overflow', 'hidden'); |
67 | $num = $('#good-num'); | 75 | $num = $('#good-num'); |
76 | + | ||
77 | + cbFn = cb; | ||
68 | } | 78 | } |
69 | 79 | ||
70 | //隐藏当前Panel | 80 | //隐藏当前Panel |
71 | function hide() { | 81 | function hide() { |
72 | $('.chose-panel').hide(); | 82 | $('.chose-panel').hide(); |
73 | - $('body').css('overflow', 'auto'); | 83 | + //$('body').css('overflow', 'auto'); |
84 | + | ||
85 | + cbFn = null; | ||
74 | } | 86 | } |
75 | 87 | ||
76 | //修改加入购物车的文字和背景 | 88 | //修改加入购物车的文字和背景 |
77 | function updateConformButtonClassAndText() { | 89 | function updateConformButtonClassAndText() { |
78 | - $chosed = $('.chose-items').find('.chosed'); | 90 | + $chosed = $allChoseItems.find('.chosed'); |
79 | if (2 === $chosed.closest('.zero-stock').length) { | 91 | if (2 === $chosed.closest('.zero-stock').length) { |
80 | - $('#chose-btn-sure').css('background-color', '#c0c0c0'); | ||
81 | - $('#chose-btn-sure').html('已售罄'); | 92 | + $('#chose-btn-sure').css('background-color', '#c0c0c0').html('已售罄'); |
82 | } else { | 93 | } else { |
83 | - $('#chose-btn-sure').css('background-color', '#eb0313'); | ||
84 | - $('#chose-btn-sure').html('确定'); | 94 | + $('#chose-btn-sure').css('background-color', '#eb0313').html('确定'); |
85 | } | 95 | } |
86 | } | 96 | } |
87 | 97 | ||
@@ -110,13 +120,13 @@ function resetColorZeroStock($siblingBlock) { | @@ -110,13 +120,13 @@ function resetColorZeroStock($siblingBlock) { | ||
110 | // 选择了颜色切换商品图片 | 120 | // 选择了颜色切换商品图片 |
111 | function changeGoodImgWhenClickColor() { | 121 | function changeGoodImgWhenClickColor() { |
112 | if (hasChooseColor && curColorIndex) { | 122 | if (hasChooseColor && curColorIndex) { |
113 | - $('.chose-panel').find('.thumb').addClass('hide').eq(curColorIndex).removeClass('hide'); | 123 | + $imgsThumb.addClass('hide').eq(curColorIndex).removeClass('hide'); |
114 | } | 124 | } |
115 | } | 125 | } |
116 | 126 | ||
117 | init(); | 127 | init(); |
118 | 128 | ||
119 | -$('.yoho-page').on('touchstart', '.chose-panel', function(e) { | 129 | +$yohoPage.on('touchstart', '.chose-panel', function(e) { |
120 | var $cur = $(e.target); | 130 | var $cur = $(e.target); |
121 | 131 | ||
122 | if ($cur.closest('.main').length > 0) { | 132 | if ($cur.closest('.main').length > 0) { |
@@ -127,12 +137,11 @@ $('.yoho-page').on('touchstart', '.chose-panel', function(e) { | @@ -127,12 +137,11 @@ $('.yoho-page').on('touchstart', '.chose-panel', function(e) { | ||
127 | hide(); | 137 | hide(); |
128 | }); | 138 | }); |
129 | 139 | ||
130 | -$('.color-list').on('touchstart', '.block', function(e) { | 140 | +$yohoPage.on('touchstart', '.color-list .block', function(e) { |
131 | var $this = $(this), | 141 | var $this = $(this), |
132 | - $that = $(e.target).closest('.chose-items'), | ||
133 | index, | 142 | index, |
134 | - curSelectedSizeBlock, | ||
135 | - $sizeChosed, | 143 | + curSizeBlock, |
144 | + $preSizeBlock, | ||
136 | scindex, | 145 | scindex, |
137 | curGoodNum; | 146 | curGoodNum; |
138 | 147 | ||
@@ -141,16 +150,16 @@ $('.color-list').on('touchstart', '.block', function(e) { | @@ -141,16 +150,16 @@ $('.color-list').on('touchstart', '.block', function(e) { | ||
141 | $this.siblings('.chosed').removeClass('chosed'); | 150 | $this.siblings('.chosed').removeClass('chosed'); |
142 | index = $this.index(); | 151 | index = $this.index(); |
143 | 152 | ||
144 | - $sizeChosed = $siblingBlock.find('.chosed'); | ||
145 | - scindex = $sizeChosed.index(); | 153 | + $preSiblingBlock = $siblingBlock.find('.chosed'); |
154 | + scindex = $preSizeBlock.index(); | ||
146 | $curSizeRow = $sizeRowList.eq(index); | 155 | $curSizeRow = $sizeRowList.eq(index); |
147 | 156 | ||
148 | // 当前颜色已经是选中状态,再点击时 | 157 | // 当前颜色已经是选中状态,再点击时 |
149 | if ($this.hasClass('chosed')) { | 158 | if ($this.hasClass('chosed')) { |
150 | 159 | ||
151 | //颜色原来已经是勾选时,要清空剩余件数的提示 | 160 | //颜色原来已经是勾选时,要清空剩余件数的提示 |
152 | - $that.find('.num .left-num').html(''); | ||
153 | - $('#left-num').val(0); | 161 | + $allChoseItems.find('.num .left-num').html(''); |
162 | + $leftNum.val(0); | ||
154 | hasChooseColor = false; | 163 | hasChooseColor = false; |
155 | 164 | ||
156 | // 当前颜色不是选中状态,选中时 | 165 | // 当前颜色不是选中状态,选中时 |
@@ -162,24 +171,24 @@ $('.color-list').on('touchstart', '.block', function(e) { | @@ -162,24 +171,24 @@ $('.color-list').on('touchstart', '.block', function(e) { | ||
162 | $curSizeRow.removeClass('hide').addClass('show'); | 171 | $curSizeRow.removeClass('hide').addClass('show'); |
163 | 172 | ||
164 | // 之前选中的尺码去掉勾选样式 | 173 | // 之前选中的尺码去掉勾选样式 |
165 | - if ($sizeChosed.length > 0) { | ||
166 | - $sizeChosed.removeClass('chosed'); | ||
167 | - curSelectedSizeBlock = $curSizeRow.children().get(scindex); | 174 | + if ($preSizeBlock.length > 0) { |
175 | + $preSizeBlock.removeClass('chosed'); | ||
176 | + | ||
168 | } | 177 | } |
169 | 178 | ||
179 | + curSizeBlock = $curSizeRow.children().get(scindex); | ||
170 | // 当前选中颜色对应的尺码行,其对应的尺码加上勾选样式 (前提是要判断下这个尺码是否存在) | 180 | // 当前选中颜色对应的尺码行,其对应的尺码加上勾选样式 (前提是要判断下这个尺码是否存在) |
171 | - if (curSelectedSizeBlock) { | ||
172 | - curGoodNum = $(curSelectedSizeBlock).data('num'); | ||
173 | - $(curSelectedSizeBlock).addClass('chosed'); | 181 | + if (curSizeBlock) { |
182 | + curGoodNum = $(curSizeBlock).data('num'); | ||
183 | + $(curSizeBlock).addClass('chosed'); | ||
174 | 184 | ||
175 | //如果当前有尺码被选中,且数量等于0,则颜色块添加数量为0的样式 | 185 | //如果当前有尺码被选中,且数量等于0,则颜色块添加数量为0的样式 |
176 | if (curGoodNum > 0) { | 186 | if (curGoodNum > 0) { |
177 | - $that.find('.num .left-num').html('剩余' + curGoodNum + '件'); | ||
178 | - $('#left-num').val(curGoodNum); | 187 | + $allChoseItems.find('.num .left-num').html('剩余' + curGoodNum + '件'); |
188 | + $leftNum.val(curGoodNum); | ||
179 | } else { | 189 | } else { |
180 | - $(curSelectedSizeBlock).removeClass('zero-stock').addClass('zero-stock'); | ||
181 | - $that.find('.num .left-num').html(''); | ||
182 | - $('#left-num').val(0); | 190 | + $allChoseItems.find('.num .left-num').html(''); |
191 | + $leftNum.val(0); | ||
183 | } | 192 | } |
184 | } | 193 | } |
185 | } | 194 | } |
@@ -195,9 +204,8 @@ $('.color-list').on('touchstart', '.block', function(e) { | @@ -195,9 +204,8 @@ $('.color-list').on('touchstart', '.block', function(e) { | ||
195 | changeGoodImgWhenClickColor(); | 204 | changeGoodImgWhenClickColor(); |
196 | }); | 205 | }); |
197 | 206 | ||
198 | -$('.size-list').on('touchstart', '.block', function(e) { | 207 | +$yohoPage.on('touchstart', '.size-list .block', function(e) { |
199 | var $this = $(this), | 208 | var $this = $(this), |
200 | - $that = $(e.target).closest('.chose-items'), | ||
201 | index, | 209 | index, |
202 | curGoodNum; | 210 | curGoodNum; |
203 | 211 | ||
@@ -211,7 +219,7 @@ $('.size-list').on('touchstart', '.block', function(e) { | @@ -211,7 +219,7 @@ $('.size-list').on('touchstart', '.block', function(e) { | ||
211 | if ($this.hasClass('chosed')) { | 219 | if ($this.hasClass('chosed')) { |
212 | 220 | ||
213 | //尺码原来已经是勾选时,要清空剩余件数的提示 | 221 | //尺码原来已经是勾选时,要清空剩余件数的提示 |
214 | - $that.find('.num .left-num').html(''); | 222 | + $allChoseItems.find('.num .left-num').html(''); |
215 | $('#left-num').val(0); | 223 | $('#left-num').val(0); |
216 | hasChooseSize = false; | 224 | hasChooseSize = false; |
217 | 225 | ||
@@ -226,12 +234,12 @@ $('.size-list').on('touchstart', '.block', function(e) { | @@ -226,12 +234,12 @@ $('.size-list').on('touchstart', '.block', function(e) { | ||
226 | $curSizeBlock.removeClass('chosed'); | 234 | $curSizeBlock.removeClass('chosed'); |
227 | } | 235 | } |
228 | 236 | ||
229 | - // 如果当前有尺码被选中,且数量等于0,则颜色块添加数量为0的样式, 否则显示剩余件数 | 237 | + // 如果当前有尺码被选中,且数量等于0, 否则显示剩余件数 |
230 | if (curGoodNum > 0 && hasChooseColor) { | 238 | if (curGoodNum > 0 && hasChooseColor) { |
231 | - $that.find('.num .left-num').html('剩余' + curGoodNum + '件'); | 239 | + $allChoseItems.find('.num .left-num').html('剩余' + curGoodNum + '件'); |
232 | $('#left-num').val(curGoodNum); | 240 | $('#left-num').val(curGoodNum); |
233 | } else { | 241 | } else { |
234 | - $that.find('.num .left-num').html(''); | 242 | + $allChoseItems.find('.num .left-num').html(''); |
235 | $('#left-num').val(0); | 243 | $('#left-num').val(0); |
236 | } | 244 | } |
237 | 245 | ||
@@ -249,8 +257,8 @@ $('.size-list').on('touchstart', '.block', function(e) { | @@ -249,8 +257,8 @@ $('.size-list').on('touchstart', '.block', function(e) { | ||
249 | 257 | ||
250 | }); | 258 | }); |
251 | 259 | ||
252 | -$('.btn-minus').on('touchstart', function() { | ||
253 | - var num = $num.val(); | 260 | +$yohoPage.on('touchstart','.btn-minus', function() { |
261 | + var num = parseInt($num.val(), 10); | ||
254 | 262 | ||
255 | leftNum = $('#left-num').val(); | 263 | leftNum = $('#left-num').val(); |
256 | 264 | ||
@@ -263,10 +271,8 @@ $('.btn-minus').on('touchstart', function() { | @@ -263,10 +271,8 @@ $('.btn-minus').on('touchstart', function() { | ||
263 | } | 271 | } |
264 | 272 | ||
265 | $num.val(num - 1); | 273 | $num.val(num - 1); |
266 | -}); | ||
267 | - | ||
268 | -$('.btn-plus').on('touchstart', function() { | ||
269 | - var num = $num.val(); | 274 | +}).on('touchstart', '.btn-plus', function() { |
275 | + var num = parseInt($num.val(), 10); | ||
270 | 276 | ||
271 | leftNum = $('#left-num').val(); | 277 | leftNum = $('#left-num').val(); |
272 | 278 | ||
@@ -281,9 +287,7 @@ $('.btn-plus').on('touchstart', function() { | @@ -281,9 +287,7 @@ $('.btn-plus').on('touchstart', function() { | ||
281 | 287 | ||
282 | //TODO:库存数验证 | 288 | //TODO:库存数验证 |
283 | $num.val(num + 1); | 289 | $num.val(num + 1); |
284 | -}); | ||
285 | - | ||
286 | -$('#chose-btn-sure').on('touchstart', function() { | 290 | +}).on('touchstart', '#chose-btn-sure', function() { |
287 | 291 | ||
288 | var productSku, | 292 | var productSku, |
289 | buyNumber = $('#good-num').val() - 0, | 293 | buyNumber = $('#good-num').val() - 0, |
@@ -298,6 +302,7 @@ $('#chose-btn-sure').on('touchstart', function() { | @@ -298,6 +302,7 @@ $('#chose-btn-sure').on('touchstart', function() { | ||
298 | return; | 302 | return; |
299 | } | 303 | } |
300 | 304 | ||
305 | + //TODO status change | ||
301 | if ($('#chose-btn-sure').html() === '已售罄') { | 306 | if ($('#chose-btn-sure').html() === '已售罄') { |
302 | return; | 307 | return; |
303 | } | 308 | } |
@@ -332,10 +337,13 @@ $('#chose-btn-sure').on('touchstart', function() { | @@ -332,10 +337,13 @@ $('#chose-btn-sure').on('touchstart', function() { | ||
332 | }).done(function(res) { | 337 | }).done(function(res) { |
333 | loading.hideLoadingMask(); | 338 | loading.hideLoadingMask(); |
334 | if (res.code === 200) { | 339 | if (res.code === 200) { |
335 | - $('.num-tag').html(numInCart + buyNumber); | ||
336 | - $('.num-tag').removeClass('hide'); | 340 | + $('.num-tag').html(numInCart + buyNumber).removeClass('hide'); |
337 | confirming = false; | 341 | confirming = false; |
338 | hide(); | 342 | hide(); |
343 | + | ||
344 | + if (cbFb) { | ||
345 | + cbFn(res.location); | ||
346 | + } | ||
339 | } | 347 | } |
340 | if (res.message) { | 348 | if (res.message) { |
341 | tip.show(res.message); | 349 | tip.show(res.message); |
@@ -347,7 +355,7 @@ $('#chose-btn-sure').on('touchstart', function() { | @@ -347,7 +355,7 @@ $('#chose-btn-sure').on('touchstart', function() { | ||
347 | }); | 355 | }); |
348 | } | 356 | } |
349 | 357 | ||
350 | -}); | 358 | +});; |
351 | 359 | ||
352 | exports.init = init; | 360 | exports.init = init; |
353 | exports.show = show; | 361 | exports.show = show; |
-
Please register or login to post a comment