Authored by 毕凯

Merge branch 'feature/freeMailAct' into 'release/6.0'

免邮券领取页



See merge request !740
'use strict';
const freeMailModel = require('../models/free-mail');
exports.freeMailIndex = (req, res) => {
res.render('free-mail/index', {
page: 'free-mail-index',
localCss: true
});
};
exports.freeMailList = (req, res, next) => {
let uid = req.user.uid;
req.ctx(freeMailModel).freeMail(uid).then(result => {
res.render('free-mail/list', {
page: 'free-mail-list',
localCss: true,
listData: result
});
}).catch(next);
};
exports.receiveVerify = (req, res, next) => {
let uid = req.user.uid,
verify = true;
req.ctx(freeMailModel).freeMail(uid, verify).then(result => {
res.json(result);
}).catch(next);
};
exports.receiveCoupon = (req, res, next) => {
let uid = req.user.uid;
req.ctx(freeMailModel).receiveCoupon(uid).then(result => {
res.json(result);
}).catch(next);
};
... ...
const api = global.yoho.API;
const _ = require('lodash');
const moment = require('moment');
module.exports = class extends global.yoho.BaseModel {
constructor(ctx) {
super(ctx);
}
/**
* 领取验证以及领卷列表
*/
freeMail(uid, verify) {
return api.get('', {
method: 'app.coupons.queryFreePostCoupons',
uid: uid
}).then((result) => {
if (verify) {
return result;
} else {
if (result && result.code === 200) {
_.forEach(result.data.freePostCoupons, function(data) {
data.startTime = moment.unix(data.startTime).format('YYYY.M.D');
data.endTime = moment.unix(data.endTime).format('YYYY.M.D');
});
return result.data;
} else {
return {};
}
}
});
}
receiveCoupon(uid) {
return api.get('', {
method: 'app.coupons.getFreePostCoupons',
uid: uid
}).then((result) => {
return result;
});
}
};
... ...
... ... @@ -53,6 +53,7 @@ const userRecommend = require(`${cRoot}/user-recommend`);
const expand = require(`${cRoot}/expand-new`);
const freeMail = require(`${cRoot}/free-mail`);
// routers
... ... @@ -267,4 +268,9 @@ router.get('/my-reward', auth, expand.myReward); // 拓展新客 我的奖励页
router.get('/reward-list', expand.rewardList); // 拓展新客 我的奖励列表
router.get('/reward-detail', auth, expand.rewardDetail); // 拓展新客 我的奖励详情页
router.get('/free-mail/index', auth, freeMail.freeMailIndex); // 免邮券主页
router.get('/free-mail/list', auth, freeMail.freeMailList); // 免邮券列表页
router.get('/free-mail/verify', auth, freeMail.receiveVerify); // 免邮券领取验证
router.get('/free-mail/verifyCoupon', auth, freeMail.receiveCoupon); // 免邮券领取
module.exports = router;
... ...
<div class="free-mail-index-page yoho-page">
<div class="top-banner">
<span class="receive-btn"></span>
</div>
<div class="instructions">
<div class="instructions-detail">
<div class="title"></div>
<div class="detail-item time">
<div class="item-left">
<span class="icon"></span>
<span class="item-title">领取时间</span>
</div>
<div class="item-right">
<span><b class="color">每月均可领取,</b>领取之日起至当月月底有效,过期不补偿,领取后请尽快使用</span>
</div>
</div>
<div class="detail-item status">
<div class="item-left">
<span class="icon"></span>
<span class="item-title">领取资格</span>
</div>
<div class="item-right">
<span>您在领取时,<b class="color">必须是有货VIP金卡、白金卡用户。</b><a href="//m.yohobuy.com/home/grade">(了解您当前的VIP级别)</a> 金卡会员3张运费券,白金会员5张运费券。
</span>
</div>
</div>
<div class="detail-item tip">
<div class="item-left">
<span class="icon"></span>
<span class="item-title">温馨提示</span>
</div>
<div class="item-right">
<span>
运费券下单时账户自动扣减相应金额运费,<b class="color">可与优惠券叠加使用,</b>如后期产生退货,运费券不退回。
</span>
</div>
</div>
</div>
</div>
<div class="pop-up">
</div>
</div>
\ No newline at end of file
... ...
<div class="free-mail-list-page yoho-page">
{{# listData}}
<div class="top-banner">
<span class="coupon-name">{{name}}</span>
</div>
<div class="coupon-list">
{{# freePostCoupons}}
<div class="coupon-item">
<div class="item-left">
<span class="name">{{couponName}}</span>
<span class="time">{{startTime}}-{{endTime}}</span>
</div>
<div class="item-right">
<span class="amount">{{amount}}</span>
</div>
</div>
{{/ freePostCoupons}}
</div>
<div class="receive-btn"></div>
{{/ listData}}
</div>
\ No newline at end of file
... ...
'use strict';
const yoho = require('yoho-app');
import {
Controller
} from 'yoho-mvc';
import {
IndexView
} from './view';
import {
FreeMail
} from './model';
class FreeMailIndexController extends Controller {
constructor() {
super();
this.receiveView = new IndexView();
this.freeMailModel = new FreeMail();
this.receiveView.on('goReceive', this.goReceive.bind(this));
}
goReceive() {
this.freeMailModel.receiveVerify().then(result => {
if (result.code === 200) {
if (yoho.isApp) {
yoho.goH5('http://m.yohobuy.com/activity/free-mail/list', JSON.stringify({
action: 'go.h5',
params: {
islogin: 'N',
url: 'http://m.yohobuy.com/activity/free-mail/list'
}
}));
} else {
location.href = '//m.yohobuy.com/activity/free-mail/list';
}
} else if (result.code === 419) {
$('.pop-up').html('<div class="details"><span></span>' + result.message + '</div>').show();
} else if (result.code === 418) {
$('.pop-up').html('<div class="big">本月已领取过<br>下月再来哦~</div>').show();
} else {
$('.pop-up').html(result.message).show();
}
this.receiveView.popHide();
});
}
}
module.exports = FreeMailIndexController;
... ...
require('activity/free-mail-index.page.css');
const FreeMailIndexController = require('./controller');
new FreeMailIndexController();
... ...
'use strict';
import {
http
} from 'yoho-mvc';
class FreeMail {
/**
* 首页立即领取
*/
receiveVerify() {
return http({
type: 'GET',
url: '/activity/free-mail/verify'
});
}
}
module.exports = {
FreeMail
};
... ...
import {
View
} from 'yoho-mvc';
class IndexView extends View {
constructor() {
super('.top-banner');
this.receiveBtn = $('.receive-btn');
this.on('touchend touchcancel', 'span', this.btnClick.bind(this));
}
/**
* 立即领取按钮
*/
btnClick() {
this.emit('goReceive');
}
/**
* 弹框消失
*/
popHide() {
setTimeout(function() {
if ($('.pop-up').css('display') === 'block') {
$('.pop-up').hide();
}
}, 2000);
}
}
module.exports = {
IndexView
};
... ...
'use strict';
const tip = require('plugin/tip'),
yoho = require('yoho-app');
import {
Controller
} from 'yoho-mvc';
import {
ListView
} from './view';
import {
FreeMailList
} from './model';
class FreeMailIndexController extends Controller {
constructor() {
super();
this.listView = new ListView();
this.listMailModel = new FreeMailList();
this.listView.on('receiveCoupon', this.receiveCoupon.bind(this));
}
receiveCoupon() {
this.listMailModel.receiveCoupon().then(result => {
if (result.code === 200) {
tip.show('领取成功');
setTimeout(function() {
if (yoho.isApp) {
yoho.goH5('http://m.yohobuy.com/home/coupons', JSON.stringify({
action: 'go.coupon',
params: {
islogin: 'N',
url: 'http://m.yohobuy.com/home/coupons'
}
}));
} else {
location.href = '//m.yohobuy.com/home/coupons';
}
}, 2000);
} else {
tip.show(result.message);
}
});
}
}
module.exports = FreeMailIndexController;
... ...
require('activity/free-mail-list.page.css');
const FreeMailListController = require('./controller');
new FreeMailListController();
... ...
'use strict';
import {
http
} from 'yoho-mvc';
class FreeMailList {
/**
* 列表页领取劵
*/
receiveCoupon() {
return http({
type: 'GET',
url: '/activity/free-mail/verifyCoupon'
});
}
}
module.exports = {
FreeMailList
};
... ...
import {
View
} from 'yoho-mvc';
class ListView extends View {
constructor() {
super('.free-mail-list-page');
this.receiveBtn = $('.receive-btn');
this.on('touchend touchcancel', '.receive-btn', this.receiveClick.bind(this));
}
/**
* 领券按钮
*/
receiveClick() {
this.emit('receiveCoupon');
}
}
module.exports = {
ListView
};
... ...
.free-mail-index-page {
.top-banner {
width: 100%;
height: 375px;
background-image: resolve("activity/free-mail/banner.png");
background-size: 100%;
background-repeat: no-repeat;
.receive-btn {
width: 300px;
height: 60px;
display: block;
position: relative;
top: 278px;
left: 170px;
}
}
.instructions {
background: #c70e0e;
width: 100%;
padding: 30px 25px 40px;
font-family: "SourceHanSansCN";
.instructions-detail {
width: 100%;
height: 100%;
background: #fff;
border-radius: 15px;
padding: 32px 45px 0;
}
.title {
width: 230px;
height: 51px;
background-image: resolve("activity/free-mail/title.png");
background-size: 100%;
background-repeat: no-repeat;
margin: 0 133px 35px;
}
.color {
color: #c70e0e;
}
}
.detail-item {
width: 100%;
margin-bottom: 30px;
font-weight: 700;
position: relative;
.item-left {
width: 82px;
margin-right: 15px;
position: absolute;
top: 50%;
transform: translate(-50%, -50%);
margin-left: 20px;
.item-title {
font-size: 15px;
font-weight: 700;
text-align: center;
}
}
.item-right {
font-size: 20px;
line-height: 36px;
margin-left: 85px;
a {
border-bottom: 2px solid #c70e0e;
}
}
.icon {
display: block;
width: 67px;
height: 45px;
margin-left: 7px;
}
}
.time {
.icon {
background-image: resolve("activity/free-mail/time.png");
background-size: 100%;
background-repeat: no-repeat;
}
}
.status {
.icon {
background-image: resolve("activity/free-mail/status.png");
background-size: 100% 98%;
background-repeat: no-repeat;
}
}
.tip {
.icon {
background-image: resolve("activity/free-mail/tip.png");
background-size: 100% 98%;
background-repeat: no-repeat;
}
}
.pop-up {
position: fixed;
text-align: center;
width: 405px;
padding: 15PX;
top: 500px;
left: 50%;
margin-left: -30%;
margin-top: -170px;
background-color: #959595;
color: #fff;
font-size: 18PX;
border: none;
z-index: 100;
box-sizing: border-box;
border-radius: 42px;
display: none;
.details {
padding-top: 5px;
span {
display: block;
width: 91px;
height: 91px;
background-image: resolve("activity/free-mail/failure.png");
background-repeat: no-repeat;
background-size: 100%;
position: relative;
left: 50%;
margin-left: -46px;
margin-bottom: 14px;
}
}
}
.big {
font-size: 36px;
padding: 30px 0;
}
}
... ...
.free-mail-list-page {
.top-banner {
width: 100%;
height: 245px;
background-image: resolve("activity/free-mail/list-banner.png");
background-repeat: no-repeat;
background-size: 100%;
margin-bottom: 15px;
.coupon-name {
display: inline-block;
font-size: 45px;
color: #fff;
font-family: "SourceHanSansCN";
transform: rotate(-9.5deg);
margin: 40px 0 0 186px;
font-weight: 700;
}
}
.coupon-list {
padding: 0 35px;
color: #fff;
max-height: 452px;
overflow-y: scroll;
.coupon-item {
width: 570px;
height: 135px;
background-image: resolve("activity/free-mail/coupon.png");
background-size: 100%;
background-repeat: no-repeat;
margin-bottom: 10px;
}
.item-left {
padding-left: 110px;
font-family: "SourceHanSansCN";
width: 340px;
height: 100%;
display: inline-block;
}
.name {
font-size: 42px;
font-weight: 700;
display: inline-block;
max-width: 205px;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
.time {
font-size: 12px;
}
.item-right {
height: 100%;
display: inline-block;
font-size: 101px;
font-family: "IKEASans";
padding-left: 74px;
font-weight: 800;
}
}
.receive-btn {
height: 116px;
width: 100%;
background-image: resolve("activity/free-mail/list-btn.png");
background-size: 100%;
background-repeat: no-repeat;
}
}
... ...