fe / YOHO-ACTIVITY-PHP · Commits

Go to a project

Authored by 梁志锋
Commit 26cb79a77865c97de8938f809d0c9015113a1f78 1 parent 60f943d2

购物车尺码颜色选择

Inline Side-by-side
Showing 2 changed files with 50 additions and 207 deletions
/**
* 购物车信息读取
* @author: liangzhifeng<zhifeng.liang@yoho.cn>
* @date: 2015/12/15
*/
var info = window.cookie('cart-info');
// info 必须是 JSON 字符串
try {
info = JSON.parse(info);
} catch (e) {
info = {
deliveryId: null,
deliveryTimeId: null,
paymentTypeId: null,
yohoCoin: null,
addressId: null,
couponCode: null,
couponValue: null,
invoice: null,
invoiceText: null,
invoiceType: null,
msg: null
};
window.setCookie('cart-info', JSON.stringify(info));
}
exports.cartInfo = function(key, value) {
if (value === undefined) {
return info[key];
}
info[key] = value;
window.setCookie('cart-info', JSON.stringify(info));
};
... ... @@ -28,6 +28,7 @@ var panelTmpl,
curSizeIndex,
$curSizeRow,
$curSizeBlock = null,
firstColorId,
$sizeRowList = $('.size-list ul');
// 读取模板
... ... @@ -43,18 +44,6 @@ $.get('/cart/index/giftinfoTpl', function(html) {
//初始化购物车面板显示
function init() {
//$colorList = $('.chose-panel .color-list ul>li');
//$sizeList = $('.chose-panel .size-list ul>li');
//firstColorId = $colorList.eq(0).data('id');
//$sizeList.each(function() {
// colorIndex = $(this).data('colorid');
//
// if (colorIndex === firstColorId) {
// $(this).removeClass('hide');
// }
//});
var $firstRow = $sizeRowList.eq(0);
$firstRow.toggleClass('hide');
... ... @@ -87,21 +76,53 @@ function show(data) {
$('body').css('overflow', 'hidden');
$num = $('#good-num');
}
////显示当前Panel
//function show() {
// $('.chose-panel').show();
//
// $('body').css('overflow', 'hidden');
// $num = $('#good-num');
//}
//隐藏当前Panel
function hide() {
$('.chose-panel').hide();
$('body').css('overflow', 'auto');
}
//修改加入购物车的文字和背景
function updateConformButtonClassAndText() {
$chosed = $('.chose-items').find('.chosed');
if (2 === $chosed.closest('.zero-stock').length) {
$('#chose-btn-sure').css('background-color', '#c0c0c0');
$('#chose-btn-sure').html('已售罄');
} else {
$('#chose-btn-sure').css('background-color', '#eb0313');
$('#chose-btn-sure').html('确定');
}
}
//重置颜色块的库存为0的样式
function resetColorZeroStock($siblingBlock) {
var numArray = ($curSizeBlock.data('numstr') + '').split('/');
if (!hasChooseSize) {
$siblingBlock.find('ul>li').each(function() {
$(this).removeClass('zero-stock');
if ('0' === $(this).data('num')) {
$(this).addClass('zero-stock');
}
});
} else {
for (var i = 0; i < numArray.length; i++) {
if ('0' === numArray[i]) {
$siblingBlock.find('.block').eq(i).addClass('zero-stock');
}
}
}
}
// 选择了颜色切换商品图片
function changeGoodImgWhenClickColor() {
if (hasChooseColor && curColorIndex) {
$('.chose-panel').find('.thumb').addClass('hide').eq(curColorIndex).removeClass('hide');
}
}
$('.yoho-page').on('touchstart', '.chose-panel', function(e) {
var $cur = $(e.target);
... ... @@ -143,11 +164,6 @@ $('.color-list').on('touchstart', '.block', function(e) {
} else {
hasChooseColor = true;
//根据颜色切换图片
if ($this.closest('.block-list').hasClass('color-list')) {
$('.chose-panel').find('.thumb').addClass('hide').eq(index).removeClass('hide');
}
//把当前选中颜色对应的尺码那一行显示出来
$sizeRowList.addClass('hide');
$curSizeRow.removeClass('hide').addClass('show');
... ... @@ -180,75 +196,7 @@ $('.color-list').on('touchstart', '.block', function(e) {
curColorIndex = index;
// 设置按钮的样式和文字
$chosed = $('.chose-items').find('.chosed');
if (2 === $chosed.closest('.zero-stock').length) {
$('#chose-btn-sure').css('background-color', '#c0c0c0');
$('#chose-btn-sure').html('已售罄');
} else {
$('#chose-btn-sure').css('background-color', '#eb0313');
$('#chose-btn-sure').html('确定');
}
/**if ($chosed.length === 0) {
$this.closest('ul>li').each(function() {
$(this).removeClass('zero-stock');
if ('0' === $(this).data('num')) {
$(this).addClass('zero-stock');
}
});
$siblingBlock.find('ul>li').each(function() {
$(this).removeClass('zero-stock');
if ('0' === $(this).data('num')) {
$(this).addClass('zero-stock');
}
});
} else if ($chosed.length === 1 && $this.hasClass('chosed')) {
$sizeList.addClass('hide');
//切换尺码信息
$sizeList.each(function() {
colorIndex = $(this).data('colorid');
if (colorIndex === $this.data('id')) {
$(this).removeClass('hide');
}
});
numArray = ($chosed.data('numstr') + '').split('/');
$siblingBlock.find('.block').removeClass('zero-stock');
for (i = 0; i < numArray.length; i++) {
if ('0' === numArray[i]) {
$siblingBlock.find('.block').eq(i).addClass('zero-stock');
}
}
} else if ($chosed.length === 1 && !$this.hasClass('chosed')) {
$('#chose-btn-sure').css('background-color', '#eb0313');
$('#chose-btn-sure').html('确定');
$siblingBlock.find('ul>li').each(function() {
$(this).removeClass('zero-stock');
if ('0' === $(this).data('num')) {
$(this).addClass('zero-stock');
}
});
$that.find('.num .left-num').html('');
} else if ($chosed.length === 2) {
$siblingBlock.find('.block').removeClass('zero-stock');
for (i = 0; i < currentNumArray.length; i++) {
if ('0' === currentNumArray[i]) {
$siblingBlock.find('.block').eq(i).addClass('zero-stock');
}
}
numArray = ($siblingBlock.find('.chosed').data('numstr') + '').split('/');
$that.find('.num .left-num').html('剩余' + numArray[index] + '件');
if (2 === $chosed.closest('.zero-stock').length) {
$('#chose-btn-sure').css('background-color', '#c0c0c0');
$('#chose-btn-sure').html('已售罄');
} else {
$('#chose-btn-sure').css('background-color', '#eb0313');
$('#chose-btn-sure').html('确定');
}
}**/
updateConformButtonClassAndText();
});
... ... @@ -264,7 +212,7 @@ $('.size-list').on('touchstart', '.block', function(e) {
$this.siblings('.chosed').removeClass('chosed');
index = $this.index();
$colorChosed = $siblingBlock.find('.chosed');
//$colorChosed = $siblingBlock.find('.chosed');
$curSizeRow = $sizeRowList.eq(index);
// 当前尺码已经是选中状态,再点击时
... ... @@ -275,11 +223,6 @@ $('.size-list').on('touchstart', '.block', function(e) {
$('#left-num').val(0);
hasChooseSize = false;
// 去掉已经选中颜色的 数量为0的样式
if ($colorChosed.length > 0) {
$colorChosed.removeClass('zero-stock').addClass('zero-stock');
}
// 当前尺码不是选中状态,选中时
} else {
hasChooseSize = true;
... ... @@ -296,10 +239,12 @@ $('.size-list').on('touchstart', '.block', function(e) {
$that.find('.num .left-num').html('剩余' + curGoodNum + '件');
$('#left-num').val(curGoodNum);
} else {
$colorChosed.removeClass('zero-stock').addClass('zero-stock');
//$colorChosed.removeClass('zero-stock').addClass('zero-stock');
$that.find('.num .left-num').html('');
$('#left-num').val(0);
}
}
$this.toggleClass('chosed');
... ... @@ -307,78 +252,10 @@ $('.size-list').on('touchstart', '.block', function(e) {
$curSizeBlock = $this;
// 设置按钮的样式和文字
$chosed = $('.chose-items').find('.chosed');
if (2 === $chosed.closest('.zero-stock').length) {
$('#chose-btn-sure').css('background-color', '#c0c0c0');
$('#chose-btn-sure').html('已售罄');
} else {
$('#chose-btn-sure').css('background-color', '#eb0313');
$('#chose-btn-sure').html('确定');
}
/**if ($chosed.length === 0) {
$this.closest('ul>li').each(function() {
$(this).removeClass('zero-stock');
if ('0' === $(this).data('num')) {
$(this).addClass('zero-stock');
}
});
$siblingBlock.find('ul>li').each(function() {
$(this).removeClass('zero-stock');
if ('0' === $(this).data('num')) {
$(this).addClass('zero-stock');
}
});
} else if ($chosed.length === 1 && $this.hasClass('chosed')) {
if ($this.closest('.block-list').hasClass('color-list')) {
$sizeList.addClass('hide');
//切换尺码信息
$sizeList.each(function() {
colorIndex = $(this).data('colorid');
if (colorIndex === $this.data('id')) {
$(this).removeClass('hide');
}
});
}
numArray = ($chosed.data('numstr') + '').split('/');
$siblingBlock.find('.block').removeClass('zero-stock');
for (i = 0; i < numArray.length; i++) {
if ('0' === numArray[i]) {
$siblingBlock.find('.block').eq(i).addClass('zero-stock');
}
}
} else if ($chosed.length === 1 && !$this.hasClass('chosed')) {
$('#chose-btn-sure').css('background-color', '#eb0313');
$('#chose-btn-sure').html('确定');
updateConformButtonClassAndText();
$siblingBlock.find('ul>li').each(function() {
$(this).removeClass('zero-stock');
if ('0' === $(this).data('num')) {
$(this).addClass('zero-stock');
}
});
$that.find('.num .left-num').html('');
} else if ($chosed.length === 2) {
$siblingBlock.find('.block').removeClass('zero-stock');
for (i = 0; i < currentNumArray.length; i++) {
if ('0' === currentNumArray[i]) {
$siblingBlock.find('.block').eq(i).addClass('zero-stock');
}
}
numArray = ($siblingBlock.find('.chosed').data('numstr') + '').split('/');
$that.find('.num .left-num').html('剩余' + numArray[index] + '件');
if (2 === $chosed.closest('.zero-stock').length) {
$('#chose-btn-sure').css('background-color', '#c0c0c0');
$('#chose-btn-sure').html('已售罄');
} else {
$('#chose-btn-sure').css('background-color', '#eb0313');
$('#chose-btn-sure').html('确定');
}
}**/
// 重置颜色块的样式
resetColorZeroStock($siblingBlock);
});
... ...