fe / yohobuywap-node · Commits

Go to a project

Authored by zhangxiaoru
Commit 3bf859094a587074d7cbc7c087980e766277a4b3 1 parent 673718f2

尺码优化

Inline Side-by-side
Showing 5 changed files with 72 additions and 13 deletions
... ... @@ -1560,7 +1560,6 @@ let getNewProductAsyncData = (data) => {
}
finalResult.isStudent = data.isStudent;
return finalResult;
});
});
... ... @@ -1753,7 +1752,8 @@ let _detailDataPkgAsync = (origin, uid, vipLevel, ua) => {
goodsId: value.goods_id,
colorId: value.color_id,
name: size.size_name,
sizeNum: size.storage_number
sizeNum: size.storage_number,
sizeInfo: size.size_info
});
sizeName = size.size_name;
... ... @@ -1762,7 +1762,8 @@ let _detailDataPkgAsync = (origin, uid, vipLevel, ua) => {
// 判断出没有库存则显示灰色
let build = {
id: size.size_id,
storage: size.storage_number
storage: size.storage_number,
sizeInfo: size.size_info
};
allSizeList[sizeName] = (allSizeList[sizeName] === null ||
... ... @@ -1771,6 +1772,7 @@ let _detailDataPkgAsync = (origin, uid, vipLevel, ua) => {
colorStorageGroup[value.product_skc][sizeName] = parseInt(size.storage_number, 10);
});
// 颜色分组
colorList.push({
id: value.color_id,
... ... @@ -1796,11 +1798,13 @@ let _detailDataPkgAsync = (origin, uid, vipLevel, ua) => {
size: []
};
_.forEach(allSizeList, (value, key) => {
// 默认尺码
sizeGroup[0].size.push({
name: key,
sizeNum: _.toNumber(value.storage) > 0 ? true : false,
id: value.id
id: value.id,
sizeInfo: value.sizeInfo
});
colorGroup[i] = {
... ... @@ -1831,6 +1835,7 @@ let _detailDataPkgAsync = (origin, uid, vipLevel, ua) => {
// 遍历所有颜色, 构建尺码显示数据
i = 1;
_.forEach(colorList, function(value) {
// 各个尺码的颜色， 每行显示一个颜色的对应尺码
sizeGroup[i] = {
size: sizeList[value.skcId],
... ... @@ -1841,6 +1846,7 @@ let _detailDataPkgAsync = (origin, uid, vipLevel, ua) => {
colorGroup[0].color.push(value);
++i;
});
}
let soldOut = (origin.storage_sum === 0) || (totalStorageNum === 0); // status
let notForSale = origin.attribute === 2;
... ...
... ... @@ -24,13 +24,18 @@ module.exports = {
// imCs: 'http://im.yohobuy.com/api',
// imServer: 'http://im.yohobuy.com/server'
api: 'http://api.yoho.cn/',
service: 'http://service.yoho.cn/',
liveApi: 'http://api.live.yoho.cn/',
singleApi: 'http://single.yoho.cn/',
imSocket: 'wss://imsocket.yohobuy.com:443',
imCs: 'https://imhttp.yohobuy.com/api',
imServer: 'https://imhttp.yohobuy.com/server'
// api: 'http://api.yoho.cn/',
// service: 'http://service.yoho.cn/',
// liveApi: 'http://api.live.yoho.cn/',
// singleApi: 'http://single.yoho.cn/',
// imSocket: 'wss://imsocket.yohobuy.com:443',
// imCs: 'https://imhttp.yohobuy.com/api',
// imServer: 'https://imhttp.yohobuy.com/server'
api: 'http://dev-api.yohops.com:9999/',
service: 'http://dev-service.yohops.com:9999/',
liveApi: 'http://testapi.live.yohops.com:9999/',
singleApi: 'http://api-test1.yohops.com:9999/'
},
subDomains: {
host: '.m.yohobuy.com',
... ...
... ... @@ -22,6 +22,9 @@
{{/ isY}}
{{/if}}
</p>
<p class="not-choose">请选择颜色、尺码</p>
<p class="choosed-info hide"></p>
<p class="size-info hide"></p>
</div>
</div>
<div class="chose-items">
... ... @@ -40,7 +43,7 @@
{{#each sizes}}
<ul class="size-row clearfix {{#unless @first}}hide{{/unless}}">
{{#each size}}
<li class="block {{#if chosed}} chosed{{/if}} {{#unless sizeNum}} zero-stock {{/unless}}" data-num="{{sizeNum}}" data-id="{{id}}" data-skuid="{{skuId}}">{{name}}</li>
<li class="block {{#if chosed}} chosed{{/if}} {{#unless sizeNum}} zero-stock {{/unless}}" data-num="{{sizeNum}}" data-id="{{id}}" data-skuid="{{skuId}}" data-info="{{sizeInfo}}">{{name}}</li>
{{/each}}
</ul>
{{/each}}
... ...
... ... @@ -362,6 +362,30 @@ $yohoPage.on('touchstart', '.chose-panel', function(e) {
return false;
});
function chosedLength() {
var $chosedL = $('.block-list>ul>li.chosed'),
infoHtml;
$('.choosed-info').removeClass('hide');
if (!$('.not-choose').hasClass('hide')) {
$('.not-choose').addClass('hide');
}
if ($chosedL.length === 2) {
$chosedL.each(function(val) {
infoHtml = '已选：' + $chosedL.eq(0).html() + '、' + $chosedL.eq(1).html();
})
} else if ($chosedL.length === 1) {
infoHtml = '已选：' + $chosedL.eq(0).html();
} else {
$('.choosed-info').addClass('hide');
$('.not-choose').removeClass('hide');
}
$('.choosed-info').html(infoHtml);
}
$yohoPage.on('touchstart', '.color-list .block', function() {
var $this = $(this),
index = $this.index(),
... ... @@ -450,6 +474,7 @@ $yohoPage.on('touchstart', '.color-list .block', function() {
return false;
}
chosedLength();
}).on('touchstart', '.size-list .block', function() {
var $this = $(this),
... ... @@ -475,6 +500,10 @@ $yohoPage.on('touchstart', '.color-list .block', function() {
// 老的选中颜色去掉勾选,新的选中颜色加上勾选
changeColorChosed(0);
if (!$('.size-info').hasClass('hide')) {
$('.size-info').addClass('hide');
}
// 当前尺码不是选中状态,选中时
} else {
hasChooseSize = true;
... ... @@ -496,6 +525,8 @@ $yohoPage.on('touchstart', '.color-list .block', function() {
curColorIndex = index + 1;
$curSizeBlock = $this;
$('.size-info').html($(this).data('info')).removeClass('hide');
if (window._yas && window._yas.sendCustomInfo) {
window._yas.sendCustomInfo({
op: 'YB_GDS_SIZE_C',
... ... @@ -513,6 +544,8 @@ $yohoPage.on('touchstart', '.color-list .block', function() {
$this.toggleClass('chosed');
$('#good-num').val(1);
chosedLength();
// 设置按钮的样式和文字
updateConformButtonClassAndText();
});
... ...
... ... @@ -80,7 +80,8 @@
.sale-price {
margin-right: 15px;
color: #e10;
color: #D0021b;
font-size: 28px;
&.no-price {
color: #000;
... ... @@ -91,6 +92,17 @@
color: #b0b0b0;
text-decoration: line-through;
}
.size-info {
font-size: 24px;
display: block;
margin-top: 5px;
color: #444;
}
.hide {
display: none;
}
}
.color-list,
... ...