fe / yohobuywap-node · Commits

Go to a project

Authored by 姜枫
Commit 3b8fee0a18d49cd21c19969d8a0e5d06a757ba88 2 parents eb171791 2ca45b19

Merge branch 'release/wap-optim' of http://git.yoho.cn/fe/yohobuywap-node into release/wap-optim

Inline Side-by-side
Showing 13 changed files with 216 additions and 124 deletions
... ... @@ -9,23 +9,29 @@
const favoriteModel = require('../models/favorite');
const headerModel = require('../../../doraemon/models/header'); // 头部model
const favorite = (req, res) => {
const favorite = (req, res, next) => {
let tab = req.query.tab || '';
let uid = req.user.uid;
let page = 1;
let limit = 10;
res.render('favorite', {
module: 'home',
page: 'favorite',
pageHeader: headerModel.setNav({
navTitle: '我的收藏'
}),
title: '我的收藏',
pageFooter: true,
favorite: {
productUrl: '//m.yohobuy.com/product/new',
brandUrl: '//m.yohobuy.com/product/new',
brandTab: tab === 'brand' ? true : false // 是否为品牌收藏页
}
});
favoriteModel.index(uid, page, limit, tab === 'brand').then((result)=>{
res.render('favorite', {
module: 'home',
page: 'favorite',
pageHeader: headerModel.setNav({
navTitle: '我的收藏'
}),
title: '我的收藏',
pageFooter: true,
localCss: true,
favorite: Object.assign(result, {
productUrl: '//m.yohobuy.com/product/new',
brandUrl: '//m.yohobuy.com/product/new',
brandTab: tab === 'brand' ? true : false // 是否为品牌收藏页
})
});
}).catch(next);
};
let favProduct = (req, res, next) => {
... ...
... ... @@ -24,7 +24,19 @@ exports.order = (req, res, next) => {
uid: req.user.uid
};
orderModel.order(params).then(result => {
// 获取第一页数据做服务端渲染
let initialData = {
type: 1,
page: 1,
gender: req.query.gender || '1,3',
yh_channel: req.query.channel || 1,
uid: req.user.uid
};
return Promise.all([
orderModel.order(params),
orderModel.getOrders(initialData)
]).then(result => {
res.render('order', {
module: 'home',
page: 'order',
... ... @@ -33,9 +45,11 @@ exports.order = (req, res, next) => {
}),
title: 'Yoho!Buy 有货',
pageFooter: true,
order: result
order: result[0] || [],
firstPageOrdersList: result[1] || []
});
}).catch(next);
};
/**
... ... @@ -45,13 +59,20 @@ exports.order = (req, res, next) => {
* @param next
*/
exports.getOrders = (req, res, next) => {
orderModel.getOrders({
let start = req.query.start || 0;
let params = {
type: req.query.type || 1,
page: req.query.page || 1,
gender: req.query.gender || '1,3',
yh_channel: req.query.channel || 1,
uid: req.user.uid
}).then(result => {
};
orderModel.getOrders(params).then(result => {
if (result && parseInt(params.page, 10) === 1 && parseInt(start, 10) > 0) {
result = result.slice(start || 0);
}
res.render('order-content', {
layout: false,
orders: result
... ...
... ... @@ -173,13 +173,14 @@ const favfavBrand = (uid, page, limit) => {
update: val.newProductNum
});
_.forEach(val.newProduct, function(data) {
_.forEach(val.newProduct, function(data, key) {
obj.productList.push({
link: '/product/pro_' + data.productId + '_' +
data.goods[0].id + '/' + data.cnAlphabet + '.html',
imgUrl: data.defaultImages,
price: '¥' + Number(data.marketPrice).toFixed(2),
discount: data.marketPrice > data.salesPrice ? '¥' + Number(data.salesPrice).toFixed(2) : false
discount: data.marketPrice > data.salesPrice ? '¥' + Number(data.salesPrice).toFixed(2) : false,
top3: key < 3 ? 1 : 0
});
});
... ... @@ -209,9 +210,27 @@ const favoriteDelete = (uid, type, favId) => {
fav_id: favId
});
};
const index = (uid, page, limit, isbrand) => {
if (isbrand) {
return favfavBrand(uid, page, limit).then(result=>{
if (result.total === 0) {
result = {nobrandData: 1 };
}
return result;
});
} else {
return favProduct(uid, page, limit).then(result=>{
if (result.total === 0) {
result = {noproductData: 1};
}
return result;
});
}
};
module.exports = {
favProduct,
favfavBrand,
favoriteDelete
favoriteDelete,
index
};
... ...
<div class="yoho-favorite-page yoho-page">
{{# favorite}}
<ul id="fav-tab" class="fav-tab {{# brandTab}}brand-tab{{/ brandTab}}">
<li>收藏的商品</li>
<li>收藏的品牌</li>
<li class="{{#unless brandTab}}active{{/ unless}}">收藏的商品</li>
<li class="{{# brandTab}}active{{/ brandTab}}">收藏的品牌</li>
</ul>
<div class="fav-content" id="fav-content">
<div class="fav-type">
<ul class="fav-product-list"></ul>
<div class="fav-content-loading"></div>
<div class="fav-type {{#unless brandTab}}show{{/unless}}">
<ul class="fav-product-list">
{{>favorite/favorite-product}}
</ul>
<div class="fav-content-loading hide"></div>
<div class="fav-null-box hide">
<div class="fav-null-box {{#if noproductData}}show{{/if}}">
<span class="fav-null">您暂无收藏任何商品</span>
<a class="go-shopping" href="{{productUrl}}">随便逛逛</a>
</div>
<div class="fav-load-more fav-load-background hide"></div>
</div>
<div class="fav-type">
<div class="fav-brand-swiper-wrapper"></div>
<div class="fav-content-loading"></div>
<div class="fav-type {{# brandTab}}show{{/brandTab}}">
<div class="fav-brand-swiper-wrapper">
{{>favorite/favorite-brand}}
</div>
<div class="fav-content-loading hide"></div>
<div class="fav-null-box hide">
<div class="fav-null-box {{#if nobrandData}}show{{/if}}">
<span class="fav-null">您暂无收藏任何品牌</span>
<a class="go-shopping" href="{{brandUrl}}">随便逛逛</a>
</div>
... ... @@ -27,4 +31,4 @@
</div>
</div>
{{/ favorite}}
</div>
\ No newline at end of file
</div>
... ...
{{# hasFavBrand}}
<div class="fav-brand-swiper">
<a class="swiper-header" href="{{link}}">
<div class="swiper-logo">
{{#if brandImg}}
<img src="{{image brandImg 30 30}}" onerror="this.remove()" alt=""/>
{{/if}}
</div>
<div class="brand-info">
<span class="brand-name">{{brandName}}</span>
<div class="brand-update">
{{# update}}
<span class="brand-new">上新<b>{{.}}</b></span>
{{/ update}}
{{# discount}}
<span class="brand-discount">折扣<b>{{.}}</b></span>
{{/ discount}}
</div>
</div>
<span class="fav-more"></span>
</a>
{{#if productList}}
<div id="swiper-container-{{id}}" class="swiper-container" data-id="{{id}}">
<ul class="swiper-wrapper swiper-wrapper-{{id}}">
{{# productList}}
<li class="swiper-slide">
<a href="{{link}}">
<img class="swiper-lazy" data-src="{{image imgUrl 235 314}}" alt=""/>
</a>
<div class="brand-product">
<div class="{{# discount}}price-discount{{/ discount}}">
{{# discount}}<span>{{.}}<span>{{/ discount}}
<b>{{price}}</b>
</div>
</div>
</li>
{{/ productList}}
</ul>
</div>
{{/if}}
</div>
{{/ hasFavBrand}}
{{>favorite/favorite-brand}}
... ...
{{# hasFavProduct}}
<li data-id="{{favId}}" class="{{#if invalidGoods}}invalidGoods{{/if}}">
<a href="{{link}}">
<div class="fav-img-box">
<img src="{{imgUrl}}" alt=""/>
</div>
<div class="fav-info-list">
<h2>{{title}}</h2>
<div class="fav-price">
{{# discountPrice}}
<span class="new-price">{{.}}</span>
{{/ discountPrice}}
<span class="fav-price {{# discountPrice}}price-underline{{/ discountPrice}}">{{price}}</span>
</div>
{{# savePrice}}
<div class="save-price save-price-number">
比收藏时降价了<span>{{.}}</span>
<span class="del-fav iconfont">&#xe621;</span>
</div>
{{/ savePrice}}
{{^ savePrice}}
<div class="save-price">
{{# sellOut}}
<span class="sell-out">已售罄</span>
{{/ sellOut}}
<span class="del-fav iconfont">&#xe621;</span>
</div>
{{/ savePrice}}
</div>
</a>
</li>
{{/ hasFavProduct}}
{{>favorite/favorite-product}}
... ...
... ... @@ -9,6 +9,21 @@
</ul>
<div id="order-container" class="order-container">
{{#if walkwayUrl}}
<div class="no-order">
<div class="icon"></div>
<span>你还没有订单!</span>
<a class="walk-way" href="{{walkwayUrl}}">随便逛逛</a>
</div>
{{^}}
<div class="firstscreen-orders">
{{#each @root.firstPageOrdersList}}
{{> order/order}}
{{/each}}
</div>
{{/if}}
{{#each navs}}
<div class="orders{{#unless active}} hide{{/unless}}"></div>
{{/each}}
... ...
{{# hasFavBrand}}
<div class="fav-brand-swiper">
<a class="swiper-header" href="{{link}}">
<div class="swiper-logo">
{{#if brandImg}}
<img src="{{image2 brandImg w=30 h=30 q=60}}" onerror="this.remove()" alt=""/>
{{/if}}
</div>
<div class="brand-info">
<span class="brand-name">{{brandName}}</span>
<div class="brand-update">
{{# update}}
<span class="brand-new">上新<b>{{.}}</b></span>
{{/ update}}
{{# discount}}
<span class="brand-discount">折扣<b>{{.}}</b></span>
{{/ discount}}
</div>
</div>
<span class="fav-more"></span>
</a>
{{#if productList}}
<div id="swiper-container-{{id}}" class="swiper-container" data-id="{{id}}">
<ul class="swiper-wrapper swiper-wrapper-{{id}}">
{{# productList}}
<li class="swiper-slide">
<a href="{{link}}">
<img class="swiper-lazy" {{#if top3}}src{{else}}data-src{{/if}}="{{image2 imgUrl w=235 h=314 q=60}}" alt=""/>
</a>
<div class="brand-product">
<div class="{{# discount}}price-discount{{/ discount}}">
{{# discount}}<span>{{.}}<span>{{/ discount}}
<b>{{price}}</b>
</div>
</div>
</li>
{{/ productList}}
</ul>
</div>
{{/if}}
</div>
{{/ hasFavBrand}}
... ...
{{# hasFavProduct}}
<li data-id="{{favId}}" class="{{#if invalidGoods}}invalidGoods{{/if}}">
<a href="{{link}}">
<div class="fav-img-box">
<img src="{{image2 imgUrl w=30 h=30 q=60}}" alt=""/>
</div>
<div class="fav-info-list">
<h2>{{title}}</h2>
<div class="fav-price">
{{# discountPrice}}
<span class="new-price">{{.}}</span>
{{/ discountPrice}}
<span class="fav-price {{# discountPrice}}price-underline{{/ discountPrice}}">{{price}}</span>
</div>
{{# savePrice}}
<div class="save-price save-price-number">
比收藏时降价了<span>{{.}}</span>
<span class="del-fav iconfont">&#xe621;</span>
</div>
{{/ savePrice}}
{{^ savePrice}}
<div class="save-price">
{{# sellOut}}
<span class="sell-out">已售罄</span>
{{/ sellOut}}
<span class="del-fav iconfont">&#xe621;</span>
</div>
{{/ savePrice}}
</div>
</a>
</li>
{{/ hasFavProduct}}
... ...
{
"name": "m-yohobuy-node",
"version": "5.3.13",
"version": "99.3.13",
"private": true,
"description": "A New Yohobuy Project With Express",
"repository": {
... ...
... ... @@ -3,6 +3,7 @@
* @author: zxr
* @date: 2016/8/16
*/
require('../../scss/home/_favorite.css');
var $ = require('yoho-jquery'),
Hammer = require('yoho-hammer'),
Swiper = require('yoho-swiper');
... ... @@ -131,15 +132,18 @@ function loadData($parent, url, page) {
// 如果从品牌收藏入口进入
if ($('#fav-tab').hasClass('brand-tab')) {
showFavTab(1);
loadData($favBrandList, 'favBrand', 1);
// showFavTab(1);
// loadData($favBrandList, 'favBrand', 1);
initSwiper($favBrandList.html());
brandTab = true;
window.rePosFooter();
brandLockId = false;// 请求成功后解锁品牌收藏page++
} else {
showFavTab(0);
loadData($favProductList, 'favProduct', 1);
// showFavTab(0);
// loadData($favProductList, 'favProduct', 1);
brandTab = false;
window.rePosFooter();
lockId = false;// 请求成功后解锁商品收藏page++
}
favTabHammer = new Hammer(document.getElementById('fav-tab'));
... ... @@ -156,13 +160,13 @@ favTabHammer.on('tap', function(e) {
if (index === 0) {
brandTab = false;
if ($favProductList.find('li').length === 0 &&
$favProductList.closest('.fav-type').find('.fav-null-box').hasClass('hide')) {
!$favProductList.closest('.fav-type').find('.fav-null-box').hasClass('show')) {
loadData($favProductList, 'favProduct', 1);
}
} else {
brandTab = true;
if ($favBrandList.find('div').length === 0 &&
$favBrandList.closest('.fav-type').find('.fav-null-box').hasClass('hide')) {
!$favBrandList.closest('.fav-type').find('.fav-null-box').hasClass('show')) {
loadData($favBrandList, 'favBrand', 1);
}
}
... ...
... ... @@ -20,7 +20,7 @@ var winH = $(window).height();
var activeType = $navLi.filter('.active').data('type'); // 当前active的项的index
var order = {
page: 0,
page: 1,
end: false
};
... ... @@ -34,6 +34,9 @@ var orderHammer,
$reaMask = $('.reason-mask'),
reasonSwiper;
// 首屏加载标志
var firstScreen = $('.firstscreen-orders').children().size() > 0;
require('../common');
// 减少计时
... ... @@ -58,8 +61,8 @@ function downCount(item) {
seconds;
// calculate dates
hours = Math.floor((difference % _day) / _hour),
minutes = Math.floor((difference % _hour) / _minute),
hours = Math.floor((difference % _day) / _hour);
minutes = Math.floor((difference % _hour) / _minute);
seconds = Math.floor((difference % _minute) / _second);
// fix dates so that it will show two digets
... ... @@ -106,6 +109,11 @@ function getOrders(option) {
page: order.page + 1
};
if (firstScreen) {
// 如果首屏加载了，则去掉10条记录
opt.start = 10;
}
var show = option && !option.noLoadingMask;
if (inAjax) {
... ... @@ -154,6 +162,9 @@ function getOrders(option) {
setTime();
}
});
// 还原参数
firstScreen = false;
}
lazyLoad({
... ... @@ -265,7 +276,7 @@ $(window).scroll(function() {
});
// 初始化请求第一页数据
getOrders();
//getOrders();
$(function() {
reasonSwiper = new Swiper('.box-main', {
... ... @@ -273,7 +284,7 @@ $(function() {
slidesPerView: 5,
centeredSlides: true,
initialSlide: 0,
onSlideChangeStart: function(reasonSwiper) {
onSlideChangeStart: function(reasonSwiper) {//eslint-disable-line
var activeIndex = reasonSwiper.activeIndex,
slides = reasonSwiper.slides,
i = 0;
... ... @@ -301,7 +312,7 @@ $(function() {
});
});
$reaMask.find('.box-cmp').on('touchend', function(e) {
$reaMask.find('.box-cmp').on('touchend', function() {
var selSolid = reasonSwiper.slides[reasonSwiper.activeIndex],
reason = $(selSolid).text(),
reasonId = $(selSolid).data('reasonId');
... ...
@import "fav";
@import "../layout/swiper";
.yoho-favorite-page {
width: 100%;
height: auto;
... ... @@ -39,10 +42,10 @@
}
.fav-content {
.fav-type {
display: none;
}
.show {
display: block;
}
... ... @@ -77,6 +80,10 @@
font-size: 26px;
border-radius: 0.2rem;
}
.fav-null-box {
display: none;
}
}
.fav-product-list {
... ... @@ -178,13 +185,12 @@
background: url("/home/fav/save-price.png");
width: 32px;
height: 32px;
position: absolute;
top: 50%;
left: 0;
margin-top: -16px;
}
span {
margin-left: 15px;
}
... ... @@ -264,6 +270,7 @@
color: #86bf4a;
margin-right: 24px;
}
.brand-discount {
color: #d1021c;
}
... ... @@ -302,6 +309,7 @@
height: 300px;
overflow: hidden;
}
.brand-product {
height: 65px;
line-height: 65px;
... ... @@ -314,6 +322,7 @@
span {
color: #d1021c;
}
b {
color: #b0b0b0;
text-decoration: line-through;
... ... @@ -337,6 +346,7 @@
background-size: auto 40%;
}
}
.fav-content-loading {
width: 100%;
height: 2rem;
... ...