Authored by 毕凯

Merge branch 'feature/friendInvite' into 'release/6.4'

支付完成邀请好友页



See merge request !1186
... ... @@ -100,8 +100,9 @@ exports.friendInvite = (req, res, next) => {
let isApp = req.yoho.isApp;
let inciteCode = req.query.inviteCode;
let contentCode = '319f92c4b072c3c40ea4cb4499b78bb4';
let token = decodeURIComponent(req.query.token);
req.ctx(expandModel).friendInvite(inciteCode, yhChannel, limit, page, contentCode).then(result => {
req.ctx(expandModel).friendInvite(inciteCode, yhChannel, limit, page, contentCode, token).then(result => {
res.render('expand-new/friend-invite', {
pageHeader: headerModel.setNav({
navTitle: '好友邀请'
... ...
... ... @@ -4,6 +4,7 @@ const helpers = global.yoho.helpers;
const utils = '../../../utils';
const productProcess = require(`${utils}/product-process`);
const service = global.yoho.ServiceAPI;
const co = require('bluebird').coroutine;
module.exports = class extends global.yoho.BaseModel {
constructor(ctx) {
... ... @@ -171,14 +172,80 @@ module.exports = class extends global.yoho.BaseModel {
});
}
_getProductList(skns) {
return api.get('', {
method: 'app.search.li',
query: skns
}).then((result) => {
if (result && result.code === 200) {
return result.data;
}
});
}
/**
* 将商品转化成以 product_skn 为键名的对象
* @param {*} goodsArray
*/
_goodsArrayToObj(goodsArray) {
return _.keyBy(goodsArray, value => {
return value.product_skc;
});
}
_getOrderGoods(token) {
if (!token) {
return;
}
return api.get('', {
method: 'app.SpaceOrders.getProductList',
order_token: token
}).then((result) => {
let self = this;
if (result && result.code === 200) {
let sknList = '';
let sknData = _.get(result, 'data.arrays', []);
_.forEach(sknData, function(val) {
sknList += val.product_skn + ',';
});
return co(function* () {
let orderInfo;
let friendsGoods = [];
let skcGoods;
orderInfo = yield self._getProductList(sknList);
_.forEach(_.get(orderInfo, 'product_list', []), function(data) {
if (data.goods_list) {
skcGoods = _.assign(skcGoods, self._goodsArrayToObj(data.goods_list));
}
});
_.forEach(sknData, function(val) {
friendsGoods.push({
imgSrc: _.get(skcGoods[val.product_skc], 'images_url', ''),
goodUrl: helpers.urlFormat(`/product/${val.product_skn}.html`, '', null),
});
});
return friendsGoods;
})();
}
});
}
/**
* 好友邀请页
*/
friendInvite(inciteCode, yhChannel, limit, page, contentCode) {
friendInvite(inciteCode, yhChannel, limit, page, contentCode, token) {
return api.all([
this.inviteUserInfo(inciteCode),
this._hotGoods(yhChannel, limit, page),
this._getTrendPop(contentCode)
this._getTrendPop(contentCode),
this._getOrderGoods(token)
]).then(result => {
let friendInviteData = {};
... ... @@ -189,6 +256,11 @@ module.exports = class extends global.yoho.BaseModel {
inviteCode: _.get(result[0], 'data.inviteCode', '')
}) : '//m.yohobuy.com/reg.html';
if (token) {
friendInviteData.payText = true;
friendInviteData.friendsGoods = _.get(result, '[3]', []);
}
return friendInviteData;
});
}
... ...
<div class="friend-invite-page yoho-page">
{{# friendInviteData}}
<div class="banner">
<span class="title">您的好友{{nickname}}<br><b>邀请您来有货玩潮流</b></span>
<span class="title">您的好友{{nickname}}<br><b>{{#if payText}}发现了好物并完成下单{{else}}邀请您来有货玩潮流{{/if}}</b></span>
<span class="ico-left"></span>
<span class="ico-right"></span>
{{#if friendsGoods}}
<div class="avatar-wrap">
<div class="avatar-swiper avatar">
<ul class="clearfix swiper-wrapper">
{{# friendsGoods}}
<li class="order-good swiper-slide">
<a href="{{goodUrl}}">
<img class="" src="{{image imgSrc 240 320}}">
</a>
<li>
{{/ friendsGoods}}
</ul>
</div>
</div>
{{/if}}
<div class="tip-text">
<img src="{{image2 imgSrc w=951 h=522 q=100}}">
</div>
... ... @@ -13,7 +31,7 @@
{{# hotGoods}}
<a class="goods-info" href="{{url}}" data-good-id="{{product_id}}">
<div class="goods-image">
<img src="{{image default_images 318 425}}">
<img class="lazy" data-original="{{image default_images 318 425}}">
</div>
<div class="good-detail-text">
<div class="price">
... ...
'use strict';
require('activity/friend-invite.page.css');
let PRDID = [];
let Swiper = require('yoho-swiper');
let $avatarWrap = $('.avatar-wrap');
let bannerLen = $('.avatar-wrap').find('.swiper-slide').length;
let lazyLoad = require('plugin/lazyload-v2');
lazyLoad('img[class=lazy]');
$('.good-list').find('.goods-info').each(function() {
PRDID.push($(this).data('good-id'));
... ... @@ -31,3 +37,17 @@ $('.goods-info').click(function() {
}, true);
}
});
if (bannerLen > 0) {
new Swiper($avatarWrap.find('.avatar-swiper')[0], {
lazyLoading: true,
lazyLoadingInPrevNextAmount: 3,
initialSlide: 1,
centeredSlides: true,
slidesPerView: 'auto',
loopedSlides: bannerLen,
watchSlidesProgress: true,
watchSlidesVisibility: true,
spaceBetween: 6
});
}
... ...
@import "layout/swiper";
.friend-invite-page {
background-image: resolve("activity/expand-new/back.png");
background-size: 100%;
... ... @@ -6,14 +7,14 @@
.banner {
width: 655px;
height: 621px;
margin: 0 0 25px 47px;
background-image: resolve("activity/expand-new/friend-tip.png");
background-size: 100%;
background-image: resolve("activity/expand-new/friend-tip.jpg");
background-size: 100% 100%;
background-repeat: no-repeat;
text-align: center;
padding-top: 50px;
position: relative;
padding-bottom: 70px;
.title {
display: inline-block;
... ... @@ -22,10 +23,32 @@
font-weight: 700;
b {
font-size: 39px;
font-size: 37px;
}
}
.ico-left {
display: inline-block;
width: 99px;
height: 44px;
position: absolute;
left: 40px;
top: 102px;
background-image: resolve("activity/expand-new/tip-left.png");
background-size: 100%;
}
.ico-right {
display: inline-block;
width: 79px;
height: 36px;
position: absolute;
right: 60px;
top: 92px;
background-image: resolve("activity/expand-new/tip-right.png");
background-size: 100%;
}
.tip-text {
width: 628px;
margin: 10px;
... ... @@ -37,8 +60,39 @@
height: 80px;
display: block;
position: absolute;
bottom: 0;
bottom: -20px;
left: 160px;
background-image: resolve("activity/expand-new/go-btn.png");
background-size: 100%;
background-repeat: no-repeat;
}
}
.avatar-wrap {
margin: 15px 0;
.avatar-swiper {
overflow: hidden;
margin: 0 25px;
padding-bottom: 20px;
.swiper-wrapper {
white-space: nowrap;
padding-top: 20px;
}
.swiper-slide {
float: left;
width: 240px;
height: 318px;
box-shadow: 0 3px 3px #aaa;
}
.swiper-slide-active {
transform: scale(1.1);
transition: 300ms;
z-index: 2;
}
}
}
... ...