fe / yohobuywap-node · Commits

Go to a project

Authored by 王水玲
Commit 6930c5c0750fc5f2d244f9b38cb8cb6d44e86da8 1 parent f22941b5

sale

Inline Side-by-side
Showing 16 changed files with 262 additions and 159 deletions
... ... @@ -13,14 +13,14 @@ const headerModel = require('../../../doraemon/models/header');
const log = require(`${library}/logger`);
const saleModel = require(`${mRoot}/sale`);
const queryParam = {
brand: '0',
gender: '1,2,3',
sort: '0',
size: '0',
price: '0',
discount: '0.1,0.9'
};
// const queryParam = {
// brand: '0',
// gender: '1,2,3',
// sort: '0',
// size: '0',
// price: '0',
// discount: '0.1,0.9'
// };
const saleLogger = (err, res) => {
log.error('sale页面渲染错误:' + JSON.stringify(err));
... ... @@ -41,7 +41,7 @@ exports.index = (req, res) => {
};
saleModel.getSaleData().then((result) => {
res.render('sale', Object.assign(renderData, queryParam, {
res.render('sale', Object.assign(renderData, {
content: result,
floorHeader: {
title: {
... ... @@ -67,7 +67,7 @@ exports.breakCode = (req, res) => {
};
saleModel.getBreakCodeData().then((result) => {
res.render('break-code', Object.assign(renderData, queryParam, result));
res.render('break-code', Object.assign(renderData, result));
}).catch((err) => {
saleLogger(err, res);
});
... ... @@ -108,7 +108,7 @@ exports.specialDetail = (req, res) => {
saleModel.getSpecialDetailData(id).then((result) => {
headerData.navTitle = result.title;
renderData.pageHeader = headerData;
res.render('special-detail', Object.assign(renderData, queryParam, result));
res.render('special-detail', Object.assign(renderData, result));
}).catch((err) => {
saleLogger(err, res);
});
... ... @@ -127,7 +127,7 @@ exports.vip = (req, res) => {
};
saleModel.getVipData().then((result) => {
res.render('vip', Object.assign(renderData, queryParam, {
res.render('vip', Object.assign(renderData, {
content: result
}));
}).catch((err) => {
... ... @@ -154,7 +154,8 @@ exports.search = (req, res) => {
res.render('product', {
layout: false,
params: params,
goods: result
goods: result,
saleVip: req.query.saleType === '2' && !req.user.uid
});
});
};
... ...
... ... @@ -34,7 +34,7 @@ const timeFormat = {
const typeCont = {
price: ['s_p_desc', 's_p_asc'],
discount: ['p_d_desc', 'p_d_asc'],
sales: ['s_n_desc', 's_n_asc'],
sale: ['s_n_desc', 's_n_asc'],
newest: ['s_t_desc', 's_t_asc'],
stock: ['s_s_desc', 's_s_asc']
};
... ... @@ -326,6 +326,12 @@ const processFilter = (list, options) => {
return;
}
console.log(options, key);
if ((options.hideSize && key === 'size') || (options.hideSort && key === 'groupSort')) {
return;
}
classify.dataType = filtersType[key].dataType;
classify.name = filtersType[key].name;
classify.title = filtersType[key].title;
... ... @@ -395,12 +401,13 @@ const processBreakingSort = (list) => {
*/
const searchSales = (params) => {
params = Object.assign({
limit: '20'
limit: '50'
}, params);
if (typeCont[params.type]) {
params.order = typeCont[params.type][params.order];
}
return api.get('', sign.apiSign(Object.assign({
method: 'app.search.sales'
}, params)), true);
... ... @@ -412,7 +419,11 @@ const searchSales = (params) => {
exports.getFilterData = (params) => {
return searchSales(params).then((result) => {
if (result && result.code === 200) {
return processFilter(result.data.filter || []);
console.log(params);
return processFilter(result.data.filter || [], {
hideSize: params.saleType === '1',
hideSort: params.saleType === '1'
});
} else {
logger.error('SALE 商品搜索返回 code 不是 200');
return [];
... ...
... ... @@ -16,7 +16,6 @@
<li class="new active">
<a href="javascript:void(0);">
<span class="span-test">最新</span>
<span class="iconfont cur">&#xe616;</span>
</a>
</li>
<li class="price">
... ... @@ -45,19 +44,5 @@
</li>
</ul>
<div id="goods-container" class="goods-container">
<div class="new-goods container clearfix">
{{# goods}}
{{> common/goods}}
{{/ goods}}
</div>
<div class="price-goods container hide clearfix"></div>
<div class="discount-goods container hide clearfix"></div>
{{> common/filter}}
</div>
{{> common/query-param}}
{{> common/suspend-cart}}
{{> product/sale-common}}
</div>
... ...
<div class="sale-channel-page discount-page yoho-page">
{{> product/sale-banner}}
<ul id="list-nav" class="list-nav clearfix">
<li class="all active">
<a href="javascript:void(0);">
<span class="span-test">全部</span>
</a>
</li>
<li class="price">
<a href="javascript:void(0);">
<span class="span-test">价格</span>
<span class="icon">
<i class="iconfont up cur">&#xe615;</i>
<i class="iconfont down">&#xe616;</i>
</span>
</a>
</li>
<li class="discount">
<a href="javascript:void(0);">
<span class="span-test">折扣</span>
<span class="icon">
<i class="iconfont up cur">&#xe615;</i>
<i class="iconfont down">&#xe616;</i>
</span>
</a>
</li>
<li class="filter">
<a href="javascript:void(0);">
<span class="span-test">筛选</span>
<span class="iconfont cur">&#xe613;</span>
</a>
</li>
</ul>
{{> product/sale-common}}
</div>
\ No newline at end of file
... ...
<div class="sale-vip-page discount-page yoho-page">
{{> product/sale-banner}}
<ul id="list-nav" class="list-nav clearfix">
<li class="new active">
<a href="javascript:void(0);">
<span class="span-test">最新</span>
</a>
</li>
<li class="price">
<a href="javascript:void(0);">
<span class="span-test">价格</span>
<span class="icon">
<i class="iconfont up cur">&#xe615;</i>
<i class="iconfont down">&#xe616;</i>
</span>
</a>
</li>
<li class="sale">
<a href="javascript:void(0);">
<span class="span-test">销量</span>
</a>
</li>
<li class="filter">
<a href="javascript:void(0);">
<span class="span-test">筛选</span>
<span class="iconfont cur">&#xe613;</span>
</a>
</li>
</ul>
{{> product/sale-common}}
</div>
\ No newline at end of file
... ...
<div class="banner">
{{#content}}
{{! 头部banner}}
{{#if focus}}
{{> resources/banner-top}}
{{/if}}
{{/content}}
{{# activity}}
<img src="{{image coverUrl 640 250}}"/>
<p class="activity-time" data-time-ms="{{leftTime}}"><i class="iconfont time-ico">&#xe603;</i><span>{{time}}</span></p>
{{/ activity}}
</div>
\ No newline at end of file
... ...
<div class="banner">
{{#content}}
{{! 头部banner}}
{{#if focus}}
{{> resources/banner-top}}
{{/if}}
{{/content}}
{{# activity}}
<img src="{{image coverUrl 640 250}}"/>
<p class="activity-time" data-time-ms="{{leftTime}}"><i class="iconfont time-ico">&#xe603;</i><span>{{time}}</span></p>
{{/ activity}}
</div>
<ul id="list-nav" class="list-nav clearfix">
<li class="new active">
<a href="javascript:void(0);">
<span class="span-test">最新</span>
<span class="iconfont cur">&#xe616;</span>
</a>
</li>
<li class="price">
<a href="javascript:void(0);">
<span class="span-test">价格</span>
<span class="icon">
<i class="iconfont up cur">&#xe615;</i>
<i class="iconfont down">&#xe616;</i>
</span>
</a>
</li>
<li class="discount">
<a href="javascript:void(0);">
<span class="span-test">折扣</span>
<span class="icon">
<i class="iconfont up cur">&#xe615;</i>
<i class="iconfont down">&#xe616;</i>
</span>
</a>
</li>
<li class="filter">
<a href="javascript:void(0);">
<span class="span-test">筛选</span>
<span class="iconfont cur">&#xe613;</span>
</a>
</li>
</ul>
<div id="goods-container" class="goods-container">
<div class="new-goods container clearfix">
{{# goods}}
... ... @@ -51,6 +6,8 @@
</div>
<div class="price-goods container hide clearfix"></div>
<div class="discount-goods container hide clearfix"></div>
<div class="all-goods container hide clearfix"></div>
<div class="sale-goods container hide clearfix"></div>
{{> common/filter}}
</div>
... ...
... ... @@ -13,7 +13,7 @@ module.exports = {
port: 6001,
siteUrl: 'http://m.yohobuy.com',
domains: {
api: 'http://testapi.yoho.cn:28078/',
api: 'http://api.open.yohobuy.com/', // http://192.168.102.205:8080/gateway http://testapi.yoho.cn:28078/
service: 'http://testservice.yoho.cn:28077/'
},
useOneapm: false,
... ...
... ... @@ -20,7 +20,7 @@
{{/ tags}}
</div>
<div class="good-detail-img">
<a class="good-thumb" href="{{url}}" data-img={{defaultImages}}>
<a class="good-thumb" href="{{url}}">
<img class="lazy" data-original="{{image defaultImages 235 314}}">
</a>
{{# isSoonSoldOut}}
... ... @@ -40,7 +40,7 @@
<span class="market-price">¥{{.}}</span>
{{/marketPrice}}
</div>
{{#if saleVip}}
{{#if @root.saleVip}}
<div class="vip-info">
<i class="vip-icon"></i>更优惠
</div>
... ...
... ... @@ -107,6 +107,10 @@ function subClassifyTapEvt($this) {
});
}
if (hCbFn) {
hCbFn();
}
hideFilter();
}
... ...
... ... @@ -25,6 +25,8 @@ var winH = $(window).height(),
// 默认筛选条件
var defaultOpt = require('./query-param');
var storeOpt = $.extend({}, defaultOpt);
var $listNav = $('#list-nav'),
$swiperSize = $('.swiper-size'),
... ... @@ -68,6 +70,18 @@ ellipsis.init();
lazyLoad($('img.lazy'));
if ($('.banner-swiper .swiper-slide').length > 1) {
new Swiper('.swiper-container', {
lazyLoading: true,
lazyLoadingInPrevNext: true,
loop: true,
autoplay: 3000,
autoplayDisableOnInteraction: true,
paginationClickable: true,
pagination: '.banner-top .pagination-inner'
});
}
$.each($swiperSize, function(key) {
swipers[key] = new Swiper('#size-swiper-' + key, {
slidesPerView: 'auto'
... ... @@ -78,6 +92,23 @@ $.each($listNav.find('li'), function(key, item) {
$(item).addClass(goodsType[key]);
});
// 判断导航类型
function judgeType(dom) {
var navType;
if (dom.hasClass('coat')) {
navType = 'coat';
} else if (dom.hasClass('trouser')) {
navType = 'trouser';
} else if (dom.hasClass('shoes')) {
navType = 'shoes';
} else {
navType = 'other';
}
return navType;
}
/**
* 筛选注册的回调，筛选子项点击后逻辑
* 需要执行search的场景：1.点选筛选项；2.relaod为true时切换导航；3.下拉加载
... ... @@ -97,6 +128,10 @@ function search(opt) {
return;
}
if ($.type(opt) === 'object') {
opt = [opt];
}
if (opt) {
// 筛选项变更则重置reload为true
... ... @@ -150,17 +185,8 @@ function search(opt) {
$.extend(defaultOpt, ext); // 扩展筛选项
}
// 导航类别
if ($pre.hasClass('coat')) {
navType = 'coat';
} else if ($pre.hasClass('trouser')) {
navType = 'trouser';
} else if ($pre.hasClass('shoes')) {
navType = 'shoes';
} else {
navType = 'other';
}
navType = judgeType($pre);
nav = navInfo[navType];
page = nav.page + 1;
... ... @@ -204,7 +230,12 @@ function search(opt) {
break;
}
if (data === ' ') {
if ($container.hasClass('hide')) {
$container.siblings().addClass('hide');
$container.removeClass('hide');
}
if (data === '') {
nav.end = true;
if (nav.reload) {
... ... @@ -250,7 +281,9 @@ function search(opt) {
$.ajax({
type: 'GET',
url: '/product/sale/filter',
data: defaultOpt,
data: $.extend(defaultOpt, {
saleType: '1'
}),
success: function(data) {
$goodsContainer.append(data);
... ... @@ -262,6 +295,8 @@ $.ajax({
// 切换active状态到$pre上
$pre.addClass('active');
$pre.siblings('.filter').removeClass('active');
$('#size-swiper-' + $pre.index()).show();
},
missStatus: true
});
... ... @@ -278,11 +313,6 @@ $listNav.on('touchend touchcancel', function(e) {
nav, sortId, navType, $active;
e.preventDefault();
if (typeof $this === 'undefined' || $this.length === 0) {
return;
}
if ($this.hasClass('filter')) {
// 筛选面板切换状态
... ... @@ -294,29 +324,20 @@ $listNav.on('touchend touchcancel', function(e) {
$this.removeClass('active');
} else {
$pre = $this.siblings('.active');
$swiperSize.hide();
$pre.removeClass('active');
$this.addClass('active');
$swiperSize.hide();
filter.showFilter();
}
} else {
if ($this.hasClass('coat')) {
navType = 'coat';
} else if ($this.hasClass('trouser')) {
navType = 'trouser';
} else if ($this.hasClass('shoes')) {
navType = 'shoes';
} else {
navType = 'other';
}
// 导航类别
navType = judgeType($this);
nav = navInfo[navType];
if ($this.hasClass('active')) {
return;
} else {
if (!($this.hasClass('active'))) {
$active = $this.siblings('.active');
$pre = $this; // $pre为除筛选导航的其他导航项，若当前active的为筛选，则把$pre置为当前点击项
... ... @@ -342,10 +363,16 @@ $listNav.on('touchend touchcancel', function(e) {
case 'shoes':
$shoesgc.removeClass('hide');
break;
default:
case 'other':
$othergc.removeClass('hide');
break;
default:
break;
}
// 重置筛选项
filter.resetFilter();
defaultOpt = $.extend({}, storeOpt);
}
$active.removeClass('active');
... ... @@ -378,15 +405,8 @@ $swiperSize.on('touchend touchcancel', function(e) {
return;
}
if ($parentType.hasClass('coat')) {
navType = 'coat';
} else if ($parentType.hasClass('trouser')) {
navType = 'trouser';
} else if ($parentType.hasClass('shoes')) {
navType = 'shoes';
} else {
navType = 'other';
}
// 导航类别
navType = judgeType($parentType);
nav = navInfo[navType];
... ... @@ -396,7 +416,6 @@ $swiperSize.on('touchend touchcancel', function(e) {
nav.reload = true;
$active = $this.siblings('.active');
$pre = $parentType; // $pre为除筛选导航的其他导航项，若当前active的为筛选，则把$pre置为当前点击项
$active.removeClass('active');
$this.addClass('active');
sortId = $parentType.data('id');
... ...
... ... @@ -11,10 +11,11 @@ var $ = require('yoho-jquery'),
loading = require('../plugin/loading');
var $goodsContainer = $('#goods-container'),
$goodsChildren = $goodsContainer.children(),
$ngc = $($goodsChildren.get(0)),
$pgc = $($goodsChildren.get(1)),
$dgc = $($goodsChildren.get(2));
$ngc = $($goodsContainer.find('.new-goods')),
$dgc = $($goodsContainer.find('.discount-goods')),
$pgc = $($goodsContainer.find('.price-goods')),
$agc = $($goodsContainer.find('.all-goods')),
$sgc = $($goodsContainer.find('.sale-goods'));
var winH = $(window).height(),
noResult = '<p class="no-result">未找到相关搜索结果</p>';
... ... @@ -26,6 +27,12 @@ var $listNav = $('#list-nav'),
// 导航数据信息
navInfo = {
all: {
order: 1,
reload: true,
page: 0,
end: false
},
newest: {
order: 1,
reload: true,
... ... @@ -39,7 +46,13 @@ var $listNav = $('#list-nav'),
end: false
},
discount: {
order: 1,
order: 0,
reload: true,
page: 0,
end: false
},
sale: {
order: 0,
reload: true,
page: 0,
end: false
... ... @@ -55,6 +68,26 @@ ellipsis.init();
lazyLoad($('img.lazy'));
// 判断导航类型
function judgeType(dom) {
var navType;
if (dom.hasClass('new')) {
navType = 'newest';
} else if (dom.hasClass('price')) {
navType = 'price';
} else if (dom.hasClass('discount')) {
navType = 'discount';
} else if (dom.hasClass('sale')) {
navType = 'sale';
} else if (dom.hasClass('all')) {
navType = 'all';
}
return navType;
}
/**
* 筛选注册的回调，筛选子项点击后逻辑
* 需要执行search的场景：1.点选筛选项；2.relaod为true时切换导航；3.下拉加载
... ... @@ -127,15 +160,8 @@ function search(opt) {
$.extend(defaultOpt, ext); // 扩展筛选项
}
// 导航类别
if ($pre.hasClass('new')) {
navType = 'newest';
} else if ($pre.hasClass('price')) {
navType = 'price';
} else if ($pre.hasClass('discount')) {
navType = 'discount';
}
navType = judgeType($pre);
nav = navInfo[navType];
page = nav.page + 1;
... ... @@ -180,11 +206,22 @@ function search(opt) {
case 'discount':
$container = $dgc;
break;
case 'sale':
$container = $sgc;
break;
case 'all':
$container = $agc;
break;
default:
break;
}
if (data === ' ') {
if ($container.hasClass('hide')) {
$container.siblings().addClass('hide');
$container.removeClass('hide');
}
if (data === '') {
nav.end = true;
if (nav.reload) {
... ... @@ -290,20 +327,15 @@ $listNav.on('touchend touchcancel', function(e) {
}
} else {
if ($this.hasClass('new')) {
navType = 'newest';
} else if ($this.hasClass('price')) {
navType = 'price';
} else if ($this.hasClass('discount')) {
navType = 'discount';
}
// 导航类别
navType = judgeType($this);
nav = navInfo[navType];
if ($this.hasClass('active')) {
// 最新无排序切换
if ($this.hasClass('new')) {
if ($this.hasClass('new') || $this.hasClass('sale') || $this.hasClass('all')) {
return;
}
... ... @@ -341,6 +373,14 @@ $listNav.on('touchend touchcancel', function(e) {
case 'discount':
$dgc.removeClass('hide');
break;
case 'sale':
$sgc.removeClass('hide');
break;
case 'all':
$agc.removeClass('hide');
break;
default:
break;
}
... ...
... ... @@ -32,20 +32,22 @@ function getRTime() {
h = Math.floor(endTime / anHour % 24);
m = Math.floor(endTime / aMinute % 60);
s = Math.floor(endTime / aSecond % 60);
}
showTime += d > 0 ? d + '天' : '';
showTime += h > 0 ? h + '小时' : '';
showTime += m > 0 ? m + '分钟' : '';
showTime += s > 0 ? s + '秒' : '';
showTime += d > 0 ? d + '天' : '';
showTime += h > 0 ? h + '小时' : '';
showTime += m > 0 ? m + '分钟' : '';
showTime += s > 0 ? s + '秒' : '';
if (showTime.length !== '') {
showTime = '剩' + showTime;
}
if (showTime.length !== '') {
showTime = '剩' + showTime;
}
$activityTime.find('span').html(showTime);
$activityTime.find('span').html(showTime);
$activityTime.attr('data-time-ms', endTime);
$activityTime.attr('data-time-ms', endTime);
} else {
$activityTime.hide();
}
}
setInterval(getRTime, 1000);
... ...
... ... @@ -48,9 +48,10 @@
width: 20%;
font-size: 28px;
&.active a {
border-bottom: 4px solid #000;
}
/* &.active a {
border-bottom: 4px solid #000;
}
*/
a {
width: 106px;
... ...
... ... @@ -3,13 +3,17 @@
.swiper-container {
width: 100%;
height: 310px;
height: 240px;
img {
height: 100%;
width: 100%;
}
ul {
height: 240px;
}
.swiper-pagination {
bottom: 0;
left: 0;
... ...
... ... @@ -31,3 +31,9 @@
}
}
}
.sale-vip-page {
.good-info {
height: 570px;
}
}
... ...