|
|
|
var colorTpl = require('../../tpl/me/color-list.hbs');
|
|
|
|
var sizeTpl = require('../../tpl/me/size-list.hbs');
|
|
|
|
|
|
|
|
// var numCtrl = {
|
|
|
|
// valueEl: $('.number .value'),
|
|
|
|
// btn: {
|
|
|
|
// minus: $('.number .minus'),
|
|
|
|
// plus: $('.number .plus')
|
|
|
|
// },
|
|
|
|
// scope: {
|
|
|
|
// 1: {
|
|
|
|
// min: true,
|
|
|
|
// do: function(t) {
|
|
|
|
// t.btn.minus.addClass('disable');
|
|
|
|
// }
|
|
|
|
// }
|
|
|
|
// },
|
|
|
|
// initNumberScope: function() {
|
|
|
|
// var maxValue = this.valueEl.text();
|
|
|
|
//
|
|
|
|
// this.btn.plus.addClass('disable');
|
|
|
|
//
|
|
|
|
// this.scope[maxValue] = {
|
|
|
|
// max: true,
|
|
|
|
// do: function(t) {
|
|
|
|
// t.btn.plus.addClass('disable');
|
|
|
|
// }
|
|
|
|
// };
|
|
|
|
// },
|
|
|
|
// bindNumberEvent: function() {
|
|
|
|
// var $val = this.valueEl;
|
|
|
|
// var val = parseInt($val.text(), 10);
|
|
|
|
// var scope = this.scope;
|
|
|
|
// var that = this;
|
|
|
|
//
|
|
|
|
//
|
|
|
|
// this.btn.minus.on('click', function() {
|
|
|
|
// if ($(this).hasClass('disable')) {
|
|
|
|
// return;
|
|
|
|
// }
|
|
|
|
//
|
|
|
|
// if (that.btn.plus.hasClass('disable')) {
|
|
|
|
// that.btn.plus.removeClass('disable');
|
|
|
|
// }
|
|
|
|
//
|
|
|
|
// val -= 1;
|
|
|
|
// $val.text(val);
|
|
|
|
//
|
|
|
|
// if (scope[val] && scope[val].min) {
|
|
|
|
// scope[val].do(that);
|
|
|
|
// }
|
|
|
|
// });
|
|
|
|
//
|
|
|
|
// this.btn.plus.on('click', function() {
|
|
|
|
// if ($(this).hasClass('disable')) {
|
|
|
|
// return;
|
|
|
|
// }
|
|
|
|
//
|
|
|
|
// if (that.btn.minus.hasClass('disable')) {
|
|
|
|
// that.btn.minus.removeClass('disable');
|
|
|
|
// }
|
|
|
|
//
|
|
|
|
// val += 1;
|
|
|
|
// $val.text(val);
|
|
|
|
//
|
|
|
|
// if (scope[val] && scope[val].max) {
|
|
|
|
// scope[val].do(that);
|
|
|
|
// }
|
|
|
|
// });
|
|
|
|
// },
|
|
|
|
// init: function() {
|
|
|
|
// this.initNumberScope();
|
|
|
|
// this.bindNumberEvent();
|
|
|
|
// }
|
|
|
|
// };
|
|
|
|
|
|
|
|
function setActive($item) {
|
|
|
|
var color = $item.find('.color-text').data('color');
|
|
|
|
var size = $item.find('.size-text').data('size');
|
|
|
|
|
|
|
|
var $colorList = $item.find('.color-list');
|
|
|
|
var $sizeList = $item.find('.size-list');
|
|
|
|
|
|
|
|
$colorList.find('.img-box').each(function(i, box) {
|
|
|
|
var $box = $(box);
|
|
|
|
|
|
|
|
if ($box.find('img').data('color') === color) {
|
|
|
|
$colorList.find('.img-box').eq(i).addClass('active');
|
|
|
|
|
|
|
|
return false;
|
|
|
|
}
|
|
|
|
});
|
|
|
|
|
|
|
|
$sizeList.find('span').each(function(i, s) {
|
|
|
|
var $size = $(s);
|
|
|
|
|
|
|
|
if ($size.data('size') === size) {
|
|
|
|
$sizeList.find('span').eq(i).addClass('active');
|
|
|
|
}
|
|
|
|
});
|
|
|
|
}
|
|
|
|
|
|
|
|
function renderList(data) {
|
|
|
|
var cTpl;
|
|
|
|
var sTpl;
|
|
|
|
var $el = $('.goods-container');
|
|
|
|
var resultId;
|
|
|
|
var resultSkn;
|
|
|
|
|
|
|
|
if (data) {
|
|
|
|
resultId = data.productId;
|
|
|
|
resultSkn = data.productSkn;
|
|
|
|
|
|
|
|
$el.each(function(index, item) {
|
|
|
|
var $item = $(item);
|
|
|
|
var id = $item.data('id');
|
|
|
|
var skn = $item.data('skn');
|
|
|
|
var $form;
|
|
|
|
|
|
|
|
if (id === resultId && skn === resultSkn) {
|
|
|
|
$form = $item.closest('.table-body').next('.form');
|
|
|
|
|
|
|
|
if (!$form.find('.color-list').length) {
|
|
|
|
cTpl = colorTpl(data);
|
|
|
|
sTpl = sizeTpl(data);
|
|
|
|
$form.find('.group.color').append(cTpl);
|
|
|
|
$form.find('.group.size').append(sTpl);
|
|
|
|
setActive($form);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
});
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
function bindColorEvent() {
|
|
|
|
$('.color-list img').off('clice').on('click', function() {
|
|
|
|
var $this = $(this);
|
|
|
|
var $sizeList = $this.closest('.group').next('.group').find('.size-list');
|
|
|
|
var index = $this.data('index');
|
|
|
|
var colorId = $this.data('color');
|
|
|
|
var colorText = $this.attr('alt');
|
|
|
|
var $c = $this.closest('.group.color').find('.color-text');
|
|
|
|
|
|
|
|
$c.text(colorText);
|
|
|
|
$c.attr('data-color', colorId);
|
|
|
|
|
|
|
|
$this.closest('.color-list').find('.active').removeClass('active');
|
|
|
|
$this.parent().addClass('active');
|
|
|
|
|
|
|
|
$sizeList.removeClass('hide');
|
|
|
|
$sizeList.addClass('hide');
|
|
|
|
|
|
|
|
$sizeList.eq(index).removeClass('hide');
|
|
|
|
});
|
|
|
|
}
|
|
|
|
|
|
|
|
function initSizeId() {
|
|
|
|
var s = $('.size-list:not("hide")').find('span').eq(0).data('size');
|
|
|
|
|
|
|
|
$('.group.size .size-text').eq(0).attr('data-size', s);
|
|
|
|
}
|
|
|
|
|
|
|
|
function bindSizeEvent() {
|
|
|
|
$('.size-list span').off('click').on('click', function() {
|
|
|
|
var $this = $(this);
|
|
|
|
var s = $this.text();
|
|
|
|
var id = $this.data('size');
|
|
|
|
var $s = $this.closest('.group.size').find('.size-text');
|
|
|
|
|
|
|
|
$this.parent().find('.active').removeClass('active');
|
|
|
|
$this.addClass('active');
|
|
|
|
|
|
|
|
$s.text(s);
|
|
|
|
$s.attr('data-size', id);
|
|
|
|
});
|
|
|
|
}
|
|
|
|
|
|
|
|
function getProductInfo() {
|
|
|
|
var $el = $('.goods-container');
|
|
|
|
|
|
|
|
$el.each(function(index, item) {
|
|
|
|
var id = $(item).data('id');
|
|
|
|
var skn = $(item).data('skn');
|
|
|
|
|
|
|
|
if (id && skn) {
|
|
|
|
$.ajax({
|
|
|
|
url: '/me/return/getProductInfo',
|
|
|
|
data: {
|
|
|
|
productId: id,
|
|
|
|
productSkn: skn
|
|
|
|
}
|
|
|
|
}).done(function(result) {
|
|
|
|
if (result.code === 200) {
|
|
|
|
renderList(result.data);
|
|
|
|
initSizeId();
|
|
|
|
bindColorEvent();
|
|
|
|
bindSizeEvent();
|
|
|
|
}
|
|
|
|
});
|
|
|
|
}
|
|
|
|
});
|
|
|
|
}
|
|
|
|
|
|
|
|
getProductInfo();
|
|
|
|
|
|
|
|
// numCtrl.init(); |
...
|
...
|
|
