Authored by htoooth

optimize product detail

... ... @@ -285,8 +285,19 @@ const getPackage = (req, res, next) => {
.catch(next);
};
const redirectNewRouter = (req, res) => {
return res.redirect(301, helpers.urlFormat(`/p${req.params[0]}.html${req.params[3]}`, null, 'item'));
const getProductIntro = (req, res, next) => {
let skn = req.query.skn || '';
if (!skn) {
return res.json({
code: 500,
message: '服务器错误'
});
}
service.getIntro(skn)
.then(result => res.json(result))
.catch(next);
};
module.exports = {
... ... @@ -302,5 +313,5 @@ module.exports = {
getPackage,
likeConsult,
usefulConsult,
redirectNewRouter
getProductIntro
};
... ...
... ... @@ -1005,7 +1005,7 @@ const _getIntroInfo = (productSkn, maxSortId, additionalData)=> {
result.material = _getMaterialDataBySizeInfo(sizeInfo);
// 商品详情页介绍
result.details = _getDetailDataBySizeInfo(sizeInfo);
// result.details = _getDetailDataBySizeInfo(sizeInfo);
return result;
};
... ... @@ -1776,6 +1776,20 @@ const getPackage = co(function * (skn) {
return resData;
});
/**
* 获取商品详细介绍信息
*/
const getIntro = co(function * (skn) {
let sizeInfo = yield productAPI.sizeInfoAsync(skn);
let result = _getDetailDataBySizeInfo(sizeInfo);
return {
code: 200,
data: result
};
});
module.exports = {
getShareOrderListAsync: commentService.getShareOrderListAsync, // 获取评论列表
indexConsultAsync: consultService.indexAsync, // 获取咨询列表
... ... @@ -1789,5 +1803,6 @@ module.exports = {
getDetailHeader,
saleReturn,
recommendAsync,
getPackage
getPackage,
getIntro
};
... ...
... ... @@ -65,10 +65,13 @@ router.get('/outlets/special/detail', outlets.special); // 憟亥瘣餃憿
router.get('/outlets/list', outlets.list); // 奥莱品类页
router.get('/outlets/:channel', outlets.channel); // 奥莱频道页
// 商品分类列表页
// 品详情
router.get('/list', outletsList.index);
router.get(/^\/([\d]+)(.*)/, detail.showMain); // 新的商品详情routers
router.get(/\/p([\d]+)(.*)/, detail.showMainBack); // 新的商品详情routers
router.get(/^\/([\d]+)(.*)/, detail.showMain); // 新的商品详情routers
router.get(/\/p([\d]+)(.*)/, detail.showMainBack); // 老的商品详情routers
router.get('/detail/header', detail.productHeader); // 价格数据重新获取接口
router.get('/detail/intro', detail.getProductIntro); // 商品详细介绍
router.get('/detail/comment', detail.indexComment); // 商品评论
router.get('/detail/consult', detail.indexConsult); // 商品咨询
router.post('/detail/consult', auth, detail.createConsult); // 创建咨询
... ... @@ -77,7 +80,6 @@ router.get('/detail/consult/useful/:id', auth, detail.usefulConsult); // 霂
router.get('/detail/hotarea', detail.indexHotArea); // 商品热区
router.post('/index/favoriteBrand', favorite.changeFavoriteBrand); // 收藏品牌
router.post('/item/togglecollect', favorite.collectProduct); // 收藏商品
router.get('/detail/header', detail.productHeader); // 价格数据重新获取接口
router.get('/detail/return', detail.detailReturn); // 特殊商品退换货
router.get('/detail/recommend', detail.recommend); // 推荐商品
router.get('/index/isfav', favorite.isFavoriteBrand); // 品牌收藏状态
... ...
... ... @@ -7,12 +7,15 @@
<div class="lazy-load-object">
<textarea class="datalazyload" style="visibility: hidden;">
<script>
fetchHotArea();
loadProductIntro();
</script>
</textarea>
</div>
{{{details}}}
<div id="details-intro-holder">
{{{details}}}
</div>
{{#if goodsInfo.imageBanner.url}}
<a class="img-link" href="{{goodsInfo.imageBanner.url}}">
... ...
... ... @@ -18,6 +18,7 @@ var dataLazyLoad = require('../plugins/lazy-load')(document);
var setPager = require('./detail/pager');
var notify = require('./detail/notify');
var favorite = require('./detail/brand-fav');
var intro = require('./detail/intro');
var bindEvent = $.Callbacks(); // eslint-disable-line
var cartEvent = new EventProxy();
... ... @@ -1101,7 +1102,7 @@ $('.after-service-switch').click(function() {
// 商品详情区的热点
function loadHotArea() {
$.ajax({
return $.ajax({
type: 'GET',
url: '/product/detail/hotarea',
data: {
... ... @@ -1124,12 +1125,26 @@ function loadHotArea() {
});
}
window.fetchHotArea = window.once(loadHotArea);
// 商品详情区图片懒加载
function introLazyLoad() {
lazyLoad($('#details-html img'), {
threshold: 1000
});
}
// 商品详情区
function loadProductIntro() {
return intro.getHtml(skn).then(function(result) {
$(result).replaceAll('#details-intro-holder');
}).then(function() {
introLazyLoad();
return loadHotArea();
});
}
window.loadProductIntro = window.once(loadProductIntro);
// 商品详情图片懒加载
lazyLoad($('#details-html img'), {
threshold: 1000
});
// 咨询和评价
function loadComment() {
... ...
var $ = require('yoho-jquery');
exports.getHtml = function(skn) {
return $.get('/product/detail/intro', {skn: skn}).then(function(result) {
if (result.code !== 200) {
return '';
}
return result.data;
});
};
... ...
... ... @@ -1441,6 +1441,12 @@
.img-responsive {
width: 100%;
}
#details-intro-holder {
display: block;
width: 100%;
height: 500px;
}
}
.consult-comment .title {
... ...