|
@@ -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,29 @@ function checkColorSizeNum() { |
|
@@ -56,32 +64,29 @@ 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
|
-
|
|
|
66
|
- $('body').css('overflow', 'hidden');
|
|
|
67
|
$num = $('#good-num');
|
73
|
$num = $('#good-num');
|
|
|
74
|
+ cbFn = cb;
|
68
|
}
|
75
|
}
|
69
|
|
76
|
|
70
|
//隐藏当前Panel
|
77
|
//隐藏当前Panel
|
71
|
function hide() {
|
78
|
function hide() {
|
72
|
$('.chose-panel').hide();
|
79
|
$('.chose-panel').hide();
|
73
|
- $('body').css('overflow', 'auto');
|
80
|
+ cbFn = null;
|
74
|
}
|
81
|
}
|
75
|
|
82
|
|
76
|
//修改加入购物车的文字和背景
|
83
|
//修改加入购物车的文字和背景
|
77
|
function updateConformButtonClassAndText() {
|
84
|
function updateConformButtonClassAndText() {
|
78
|
- $chosed = $('.chose-items').find('.chosed');
|
85
|
+ $chosed = $allChoseItems.find('.chosed');
|
79
|
if (2 === $chosed.closest('.zero-stock').length) {
|
86
|
if (2 === $chosed.closest('.zero-stock').length) {
|
80
|
- $('#chose-btn-sure').css('background-color', '#c0c0c0');
|
|
|
81
|
- $('#chose-btn-sure').html('已售罄');
|
87
|
+ $('#chose-btn-sure').css('background-color', '#c0c0c0').html('已售罄');
|
82
|
} else {
|
88
|
} else {
|
83
|
- $('#chose-btn-sure').css('background-color', '#eb0313');
|
|
|
84
|
- $('#chose-btn-sure').html('确定');
|
89
|
+ $('#chose-btn-sure').css('background-color', '#eb0313').html('确定');
|
85
|
}
|
90
|
}
|
86
|
}
|
91
|
}
|
87
|
|
92
|
|
|
@@ -92,11 +97,11 @@ function resetColorZeroStock($siblingBlock) { |
|
@@ -92,11 +97,11 @@ function resetColorZeroStock($siblingBlock) { |
92
|
|
97
|
|
93
|
if (!hasChooseSize) {
|
98
|
if (!hasChooseSize) {
|
94
|
$siblingBlock.find('ul>li').each(function() {
|
99
|
$siblingBlock.find('ul>li').each(function() {
|
95
|
- $(this).removeClass('zero-stock');
|
|
|
96
|
- if ('0' === $(this).data('num')) {
|
|
|
97
|
- $(this).addClass('zero-stock');
|
|
|
98
|
- }
|
|
|
99
|
- });
|
100
|
+ $(this).removeClass('zero-stock');
|
|
|
101
|
+ if ('0' === $(this).data('num')) {
|
|
|
102
|
+ $(this).addClass('zero-stock');
|
|
|
103
|
+ }
|
|
|
104
|
+ });
|
100
|
|
105
|
|
101
|
} else {
|
106
|
} else {
|
102
|
for (i = 0; i < numArray.length; i++) {
|
107
|
for (i = 0; i < numArray.length; i++) {
|
|
@@ -110,13 +115,13 @@ function resetColorZeroStock($siblingBlock) { |
|
@@ -110,13 +115,13 @@ function resetColorZeroStock($siblingBlock) { |
110
|
// 选择了颜色切换商品图片
|
115
|
// 选择了颜色切换商品图片
|
111
|
function changeGoodImgWhenClickColor() {
|
116
|
function changeGoodImgWhenClickColor() {
|
112
|
if (hasChooseColor && curColorIndex) {
|
117
|
if (hasChooseColor && curColorIndex) {
|
113
|
- $('.chose-panel').find('.thumb').addClass('hide').eq(curColorIndex).removeClass('hide');
|
118
|
+ $imgsThumb.addClass('hide').eq(curColorIndex).removeClass('hide');
|
114
|
}
|
119
|
}
|
115
|
}
|
120
|
}
|
116
|
|
121
|
|
117
|
init();
|
122
|
init();
|
118
|
|
123
|
|
119
|
-$('.yoho-page').on('touchstart', '.chose-panel', function(e) {
|
124
|
+$yohoPage.on('touchstart', '.chose-panel', function(e) {
|
120
|
var $cur = $(e.target);
|
125
|
var $cur = $(e.target);
|
121
|
|
126
|
|
122
|
if ($cur.closest('.main').length > 0) {
|
127
|
if ($cur.closest('.main').length > 0) {
|
|
@@ -127,12 +132,11 @@ $('.yoho-page').on('touchstart', '.chose-panel', function(e) { |
|
@@ -127,12 +132,11 @@ $('.yoho-page').on('touchstart', '.chose-panel', function(e) { |
127
|
hide();
|
132
|
hide();
|
128
|
});
|
133
|
});
|
129
|
|
134
|
|
130
|
-$('.color-list').on('touchstart', '.block', function(e) {
|
135
|
+$yohoPage.on('touchstart', '.color-list .block', function(e) {
|
131
|
var $this = $(this),
|
136
|
var $this = $(this),
|
132
|
- $that = $(e.target).closest('.chose-items'),
|
|
|
133
|
index,
|
137
|
index,
|
134
|
- curSelectedSizeBlock,
|
|
|
135
|
- $sizeChosed,
|
138
|
+ curSizeBlock,
|
|
|
139
|
+ $preSiblingBlock,
|
136
|
scindex,
|
140
|
scindex,
|
137
|
curGoodNum;
|
141
|
curGoodNum;
|
138
|
|
142
|
|
|
@@ -141,16 +145,16 @@ $('.color-list').on('touchstart', '.block', function(e) { |
|
@@ -141,16 +145,16 @@ $('.color-list').on('touchstart', '.block', function(e) { |
141
|
$this.siblings('.chosed').removeClass('chosed');
|
145
|
$this.siblings('.chosed').removeClass('chosed');
|
142
|
index = $this.index();
|
146
|
index = $this.index();
|
143
|
|
147
|
|
144
|
- $sizeChosed = $siblingBlock.find('.chosed');
|
|
|
145
|
- scindex = $sizeChosed.index();
|
148
|
+ $preSiblingBlock = $siblingBlock.find('.chosed');
|
|
|
149
|
+ scindex = $preSiblingBlock.index();
|
146
|
$curSizeRow = $sizeRowList.eq(index);
|
150
|
$curSizeRow = $sizeRowList.eq(index);
|
147
|
|
151
|
|
148
|
// 当前颜色已经是选中状态,再点击时
|
152
|
// 当前颜色已经是选中状态,再点击时
|
149
|
if ($this.hasClass('chosed')) {
|
153
|
if ($this.hasClass('chosed')) {
|
150
|
|
154
|
|
151
|
//颜色原来已经是勾选时,要清空剩余件数的提示
|
155
|
//颜色原来已经是勾选时,要清空剩余件数的提示
|
152
|
- $that.find('.num .left-num').html('');
|
|
|
153
|
- $('#left-num').val(0);
|
156
|
+ $allChoseItems.find('.num .left-num').html('');
|
|
|
157
|
+ $leftNum.val(0);
|
154
|
hasChooseColor = false;
|
158
|
hasChooseColor = false;
|
155
|
|
159
|
|
156
|
// 当前颜色不是选中状态,选中时
|
160
|
// 当前颜色不是选中状态,选中时
|
|
@@ -162,24 +166,25 @@ $('.color-list').on('touchstart', '.block', function(e) { |
|
@@ -162,24 +166,25 @@ $('.color-list').on('touchstart', '.block', function(e) { |
162
|
$curSizeRow.removeClass('hide').addClass('show');
|
166
|
$curSizeRow.removeClass('hide').addClass('show');
|
163
|
|
167
|
|
164
|
// 之前选中的尺码去掉勾选样式
|
168
|
// 之前选中的尺码去掉勾选样式
|
165
|
- if ($sizeChosed.length > 0) {
|
|
|
166
|
- $sizeChosed.removeClass('chosed');
|
|
|
167
|
- curSelectedSizeBlock = $curSizeRow.children().get(scindex);
|
169
|
+ if ($preSiblingBlock.length > 0) {
|
|
|
170
|
+ $preSiblingBlock.removeClass('chosed');
|
|
|
171
|
+
|
168
|
}
|
172
|
}
|
169
|
|
173
|
|
|
|
174
|
+ curSizeBlock = $curSizeRow.children().get(scindex);
|
|
|
175
|
+
|
170
|
// 当前选中颜色对应的尺码行,其对应的尺码加上勾选样式 (前提是要判断下这个尺码是否存在)
|
176
|
// 当前选中颜色对应的尺码行,其对应的尺码加上勾选样式 (前提是要判断下这个尺码是否存在)
|
171
|
- if (curSelectedSizeBlock) {
|
|
|
172
|
- curGoodNum = $(curSelectedSizeBlock).data('num');
|
|
|
173
|
- $(curSelectedSizeBlock).addClass('chosed');
|
177
|
+ if (curSizeBlock) {
|
|
|
178
|
+ curGoodNum = $(curSizeBlock).data('num');
|
|
|
179
|
+ $(curSizeBlock).addClass('chosed');
|
174
|
|
180
|
|
175
|
//如果当前有尺码被选中,且数量等于0,则颜色块添加数量为0的样式
|
181
|
//如果当前有尺码被选中,且数量等于0,则颜色块添加数量为0的样式
|
176
|
if (curGoodNum > 0) {
|
182
|
if (curGoodNum > 0) {
|
177
|
- $that.find('.num .left-num').html('剩余' + curGoodNum + '件');
|
|
|
178
|
- $('#left-num').val(curGoodNum);
|
183
|
+ $allChoseItems.find('.num .left-num').html('剩余' + curGoodNum + '件');
|
|
|
184
|
+ $leftNum.val(curGoodNum);
|
179
|
} else {
|
185
|
} else {
|
180
|
- $(curSelectedSizeBlock).removeClass('zero-stock').addClass('zero-stock');
|
|
|
181
|
- $that.find('.num .left-num').html('');
|
|
|
182
|
- $('#left-num').val(0);
|
186
|
+ $allChoseItems.find('.num .left-num').html('');
|
|
|
187
|
+ $leftNum.val(0);
|
183
|
}
|
188
|
}
|
184
|
}
|
189
|
}
|
185
|
}
|
190
|
}
|
|
@@ -195,9 +200,8 @@ $('.color-list').on('touchstart', '.block', function(e) { |
|
@@ -195,9 +200,8 @@ $('.color-list').on('touchstart', '.block', function(e) { |
195
|
changeGoodImgWhenClickColor();
|
200
|
changeGoodImgWhenClickColor();
|
196
|
});
|
201
|
});
|
197
|
|
202
|
|
198
|
-$('.size-list').on('touchstart', '.block', function(e) {
|
203
|
+$yohoPage.on('touchstart', '.size-list .block', function(e) {
|
199
|
var $this = $(this),
|
204
|
var $this = $(this),
|
200
|
- $that = $(e.target).closest('.chose-items'),
|
|
|
201
|
index,
|
205
|
index,
|
202
|
curGoodNum;
|
206
|
curGoodNum;
|
203
|
|
207
|
|
|
@@ -211,7 +215,7 @@ $('.size-list').on('touchstart', '.block', function(e) { |
|
@@ -211,7 +215,7 @@ $('.size-list').on('touchstart', '.block', function(e) { |
211
|
if ($this.hasClass('chosed')) {
|
215
|
if ($this.hasClass('chosed')) {
|
212
|
|
216
|
|
213
|
//尺码原来已经是勾选时,要清空剩余件数的提示
|
217
|
//尺码原来已经是勾选时,要清空剩余件数的提示
|
214
|
- $that.find('.num .left-num').html('');
|
218
|
+ $allChoseItems.find('.num .left-num').html('');
|
215
|
$('#left-num').val(0);
|
219
|
$('#left-num').val(0);
|
216
|
hasChooseSize = false;
|
220
|
hasChooseSize = false;
|
217
|
|
221
|
|
|
@@ -226,12 +230,12 @@ $('.size-list').on('touchstart', '.block', function(e) { |
|
@@ -226,12 +230,12 @@ $('.size-list').on('touchstart', '.block', function(e) { |
226
|
$curSizeBlock.removeClass('chosed');
|
230
|
$curSizeBlock.removeClass('chosed');
|
227
|
}
|
231
|
}
|
228
|
|
232
|
|
229
|
- // 如果当前有尺码被选中,且数量等于0,则颜色块添加数量为0的样式, 否则显示剩余件数
|
233
|
+ // 如果当前有尺码被选中,且数量等于0, 否则显示剩余件数
|
230
|
if (curGoodNum > 0 && hasChooseColor) {
|
234
|
if (curGoodNum > 0 && hasChooseColor) {
|
231
|
- $that.find('.num .left-num').html('剩余' + curGoodNum + '件');
|
235
|
+ $allChoseItems.find('.num .left-num').html('剩余' + curGoodNum + '件');
|
232
|
$('#left-num').val(curGoodNum);
|
236
|
$('#left-num').val(curGoodNum);
|
233
|
} else {
|
237
|
} else {
|
234
|
- $that.find('.num .left-num').html('');
|
238
|
+ $allChoseItems.find('.num .left-num').html('');
|
235
|
$('#left-num').val(0);
|
239
|
$('#left-num').val(0);
|
236
|
}
|
240
|
}
|
237
|
|
241
|
|
|
@@ -249,8 +253,8 @@ $('.size-list').on('touchstart', '.block', function(e) { |
|
@@ -249,8 +253,8 @@ $('.size-list').on('touchstart', '.block', function(e) { |
249
|
|
253
|
|
250
|
});
|
254
|
});
|
251
|
|
255
|
|
252
|
-$('.btn-minus').on('touchstart', function() {
|
|
|
253
|
- var num = $num.val();
|
256
|
+$yohoPage.on('touchstart', '.btn-minus', function() {
|
|
|
257
|
+ var num = parseInt($num.val(), 10);
|
254
|
|
258
|
|
255
|
leftNum = $('#left-num').val();
|
259
|
leftNum = $('#left-num').val();
|
256
|
|
260
|
|
|
@@ -263,10 +267,8 @@ $('.btn-minus').on('touchstart', function() { |
|
@@ -263,10 +267,8 @@ $('.btn-minus').on('touchstart', function() { |
263
|
}
|
267
|
}
|
264
|
|
268
|
|
265
|
$num.val(num - 1);
|
269
|
$num.val(num - 1);
|
266
|
-});
|
|
|
267
|
-
|
|
|
268
|
-$('.btn-plus').on('touchstart', function() {
|
|
|
269
|
- var num = $num.val();
|
270
|
+}).on('touchstart', '.btn-plus', function() {
|
|
|
271
|
+ var num = parseInt($num.val(), 10);
|
270
|
|
272
|
|
271
|
leftNum = $('#left-num').val();
|
273
|
leftNum = $('#left-num').val();
|
272
|
|
274
|
|
|
@@ -281,9 +283,7 @@ $('.btn-plus').on('touchstart', function() { |
|
@@ -281,9 +283,7 @@ $('.btn-plus').on('touchstart', function() { |
281
|
|
283
|
|
282
|
//TODO:库存数验证
|
284
|
//TODO:库存数验证
|
283
|
$num.val(num + 1);
|
285
|
$num.val(num + 1);
|
284
|
-});
|
|
|
285
|
-
|
|
|
286
|
-$('#chose-btn-sure').on('touchstart', function() {
|
286
|
+}).on('touchstart', '#chose-btn-sure', function() {
|
287
|
|
287
|
|
288
|
var productSku,
|
288
|
var productSku,
|
289
|
buyNumber = $('#good-num').val() - 0,
|
289
|
buyNumber = $('#good-num').val() - 0,
|
|
@@ -298,6 +298,7 @@ $('#chose-btn-sure').on('touchstart', function() { |
|
@@ -298,6 +298,7 @@ $('#chose-btn-sure').on('touchstart', function() { |
298
|
return;
|
298
|
return;
|
299
|
}
|
299
|
}
|
300
|
|
300
|
|
|
|
301
|
+ //TODO status change
|
301
|
if ($('#chose-btn-sure').html() === '已售罄') {
|
302
|
if ($('#chose-btn-sure').html() === '已售罄') {
|
302
|
return;
|
303
|
return;
|
303
|
}
|
304
|
}
|
|
@@ -332,10 +333,13 @@ $('#chose-btn-sure').on('touchstart', function() { |
|
@@ -332,10 +333,13 @@ $('#chose-btn-sure').on('touchstart', function() { |
332
|
}).done(function(res) {
|
333
|
}).done(function(res) {
|
333
|
loading.hideLoadingMask();
|
334
|
loading.hideLoadingMask();
|
334
|
if (res.code === 200) {
|
335
|
if (res.code === 200) {
|
335
|
- $('.num-tag').html(numInCart + buyNumber);
|
|
|
336
|
- $('.num-tag').removeClass('hide');
|
336
|
+ $('.num-tag').html(numInCart + buyNumber).removeClass('hide');
|
337
|
confirming = false;
|
337
|
confirming = false;
|
338
|
hide();
|
338
|
hide();
|
|
|
339
|
+
|
|
|
340
|
+ if (cbFn) {
|
|
|
341
|
+ cbFn(res.location);
|
|
|
342
|
+ }
|
339
|
}
|
343
|
}
|
340
|
if (res.message) {
|
344
|
if (res.message) {
|
341
|
tip.show(res.message);
|
345
|
tip.show(res.message);
|