Authored by Jian Shi

个人收藏

... ... @@ -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) => {
... ...
... ... @@ -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}}
... ...
{{# 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}}
... ...
... ... @@ -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);
}
}
... ...
@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;
... ...