fe / yohobuywap-node · Commits

Go to a project

Authored by 郭成尧
Commit 0d0e6d8ac6fef9e1adf3e93c78c5ff7ea652dd62 1 parent 943c97f2

tab-change

Inline Side-by-side
Showing 6 changed files with 144 additions and 119 deletions
... ... @@ -12,6 +12,31 @@ const shoppingModel = require('../models/shopping');
const paymentProcess = require(global.utils + '/payment-process');
const logger = global.yoho.logger;
/**
* 优惠券数据处理
*/
const _couponProcess = conponData => {
let usableCouponsList = _.get(conponData, 'usable_coupon_catalogs.list', []);
let unusableCouponsList = _.get(conponData, 'unusable_coupon_catalogs.list', []);
let usableCouponNum = _.get(usableCouponsList, '[0].coupons').length;
let unusableCouponNum = 0;
let headMsg = _.replace(_.get(conponData, 'usable_coupon_catalogs.head_msg', []), '\n', '<br>');
_.forEach(unusableCouponsList, listItem => {
if (listItem.coupons) {
unusableCouponNum += listItem.coupons.length;
}
});
return {
usableCouponNum,
unusableCouponNum,
usableCouponsList,
unusableCouponsList,
headMsg
};
};
// cookie 参数
const actCkOpthn = {
path: '/cart/index'
... ... @@ -349,23 +374,46 @@ exports.selectCoupon = (req, res) => {
* 下单流程 选择优惠券
* New!
*/
exports.selectCoupons = (req, res) => {
exports.selectCoupons = (req, res, next) => {
let headerData = headerModel.setNav({
navTitle: '选择优惠券',
navBtn: false
});
let orderInfo;
let uid = req.user.uid;
res.render('select-coupons', {
module: 'cart',
page: 'select-coupons',
title: '选择优惠券',
selectCouponPage: true,
pageHeader: headerData,
pageFooter: false,
localCss: true,
width750: true
});
try {
orderInfo = JSON.parse(req.cookies['order-info']);
} catch (e) {
logger.info(`orderEnsure: get orderInfo from cookie error:${JSON.stringify(e)}`);
orderInfo = {};
res.clearCookie('order-info', actCkOpthn);
}
let delivery_way = orderInfo.deliveryId || 1;
let coupon_code = orderInfo.coupon_code || '';
co(function* () {
let couponApi = yield req.ctx(shoppingModel).listCoupon({
uid: uid,
delivery_way: delivery_way,
coupon_code: coupon_code
});
let result = _couponProcess(_.get(couponApi, 'data', {}));
res.render('select-coupons', {
module: 'cart',
page: 'select-coupons',
title: '选择优惠券',
selectCouponPage: true,
pageHeader: headerData,
pageFooter: false,
localCss: true,
width750: true,
result: result
});
})().catch(next);
};
/**
... ... @@ -422,30 +470,8 @@ exports.selectGiftcard = (req, res, next) => {
/**
* 购物车结算--获取优惠券列表
*/
exports.couponList = (req, res, next) => {
let orderInfo;
try {
orderInfo = JSON.parse(req.cookies['order-info']);
} catch (e) {
logger.info(`orderEnsure: get orderInfo from cookie error:${JSON.stringify(e)}`);
orderInfo = {};
res.clearCookie('order-info', actCkOpthn);
}
let delivery_way = orderInfo.deliveryId || 1;
if (req.xhr) {
return req.ctx(shoppingModel).listCoupon({
uid: req.user.uid,
delivery_way: delivery_way,
is_group_frees: 'Y' // 运费券是否分组
}).then(data => {
res.json(data);
}).catch(next);
} else {
return next();
}
exports.couponList = (req, res) => {
res.json({});
};
/**
... ...
... ... @@ -246,7 +246,6 @@ class shoppingModel extends global.yoho.BaseModel {
/**
* 获取用户优惠券列表，可用和不可用
* doc: http://git.yoho.cn/yoho-documents/api-interfaces/blob/master/订单/shopping.md
* @param uid int 用户uid
* @return see doc
*/
... ... @@ -255,7 +254,7 @@ class shoppingModel extends global.yoho.BaseModel {
method: 'app.Shopping.selectCoupon',
uid: params.uid,
delivery_way: params.delivery_way,
is_group_frees: params.is_group_frees
coupon_code: params.coupon_code // 'ap6duto122i52i,mp6dutu122i52q'
};
return this.get({data: param});
... ...
... ... @@ -39,7 +39,7 @@ router.post('/index/new/orderSub', authMW, order.orderSub); // 订单提交
// router.get('/index/new/selectCoupon', authMW, order.selectCoupon); // 选择优惠券 页面 old
router.get('/index/new/selectCoupon', authMW, order.selectCoupons); // 选择优惠券 页面 New!
router.get('/index/new/couponList', order.couponList); // [ajax]获取优惠券列表
router.post('/index/new/couponList', order.couponList); // [ajax]获取优惠券列表
router.post('/index/new/useCouponCode', order.useCouponCode); // [ajax]购物车输入优惠券码使用优惠券
router.get('/index/new/selectAddress', authMW, order.selectAddress); // 选择地址
router.get('/index/new/invoiceInfo', authMW, order.invoiceInfo); // 发票信息
... ...
{{#result}}
<div class="select-coupons-page">
<div class="filter-box">
<span class="valid">
<span class="filter-btn active">可用(99+)</span>
<span class="iconfont icon-down show-filter-btn"></span>
</span>
<span class="invalid">
<span class="filter-btn">不可用(99+)</span>
</span>
</div>
<div class="filter-item hide">
<button>全部</button>
<button>店铺券</button>
<button>活动券</button>
<button>运费券</button>
<span class="filter-btn valid active">可用({{usableCouponNum}})</span>
<span class="filter-btn invalid">不可用({{unusableCouponNum}})</span>
</div>
<div class="exchange-box">
<input type="text" placeholder="请输入优惠券码">
... ... @@ -20,45 +10,55 @@
</div>
<div class="tip-box">
<div class="tips">
<p>店铺券、活动券、运费券可叠加使用；</p>
<p>跨店铺店铺券可以叠加使用，同一个店铺的店铺券不可叠加使用。</p>
{{{headMsg}}}
</div>
<div class="tip-close"><span class="iconfont">&#xe623;</span></div>
</div>
<div class="coupon-list">
<div class="coupon">
<div class="coupon-left">
<p class="value">¥
<span>100</span>
</p>
<p class="threshold">满499可用</p>
</div>
<div class="coupon-right">
<div class="info">
<p class="title">
<span>[店铺券]</span>Adidas Origins店铺使用</p>
<p class="time">2018.1.12-2018.5.20</p>
<div class="coupon-list usable">
{{#usableCouponsList}}
{{#each ./coupons}}
<div class="coupon" data-code="{{coupon_code}}">
<div class="coupon-left">
<p class="value">{{#isEqualOr coupon_type '1' '3' '6'}}¥{{/isEqualOr}}
<span>{{coupon_value_str}}</span>
</p>
<p class="threshold">{{use_rule}}</p>
</div>
<div class="check"><span class="iconfont checkbox icon-cb-radio"></span></div>
</div>
</div>
<div class="coupon">
<div class="coupon-left">
<p class="value">¥
<span>100</span>
</p>
<p class="threshold">满499可用</p>
</div>
<div class="coupon-right">
<div class="info">
<p class="title">
<span>[店铺券]</span>Adidas Origins店铺使用</p>
<p class="time">2018.1.12-2018.5.20</p>
</div>
<div class="check">
<span class="iconfont checkbox icon-radio"></span>
<div class="coupon-right">
<div class="info">
<p class="title">
<span>[{{catalog_name}}]</span> {{coupon_name}}</p>
<p class="time">{{coupon_validity}}</p>
</div>
<div class="check"><span class="iconfont checkbox{{#isEqualOr selected 'Y'}} icon-cb-radio{{^}} icon-radio{{/isEqualOr}}"></span></div>
</div>
</div>
</div>
{{/each}}
{{/ usableCouponsList}}
</div>
<div class="coupon-list unusable hide">
{{#unusableCouponsList}}
<div class="coupon-list-type">{{./name}}</div>
{{#each ./coupons}}
<div class="coupon">
<div class="coupon-left">
<p class="value">{{#isEqualOr coupon_type '1' '3' '6'}}¥{{/isEqualOr}}
<span>{{coupon_value_str}}</span>
</p>
<p class="threshold">{{use_rule}}</p>
</div>
<div class="coupon-right">
<div class="info">
<p class="title">
<span class="{{#isEqualOr coupon_type '1'}} type-activity{{/isEqualOr}}
{{#isEqualOr coupon_type '5'}} type-freight{{/isEqualOr}}
{{#isEqualOr coupon_type '6'}} type-shop{{/isEqualOr}}">[{{catalog_name}}]</span> {{coupon_name}}</p>
<p class="time">{{coupon_validity}}</p>
</div>
</div>
</div>
{{/each}}
{{/ unusableCouponsList}}
</div>
</div>
{{/ result}}
... ...
... ... @@ -11,35 +11,19 @@ class SelectCouponController extends Page {
checkbox: $('.checkbox'),
tipBox: $('.tip-box'),
tipClose: $('.tip-close'),
showFilterBtn: $('.show-filter-btn'),
filterItem: $('.filter-item')
usableCouponList: $('.usable'),
unusableCouponList: $('.unusable')
};
this.view.filterBtn.on('click', this.tapChange.bind(this));
this.view.filterBtn.on('click', this.tabChange.bind(this));
this.view.coupon.on('click', '.checkbox', this.check.bind(this));
this.view.tipClose.on('click', this.closeTip.bind(this));
this.view.showFilterBtn.on('click', this.showFilter.bind(this));
this.getCouponsData();
}
/**
* 获取优惠券数据
*/
getCouponsData() {
this.ajax({
type: 'GET',
url: '/cart/index/new/couponList',
dataType: 'json'
}).then(result => {
console.log(result);
});
}
/**
* tab 切换
*/
tapChange(event) {
tabChange(event) {
let itemClicked = $(event.currentTarget);
if (itemClicked.hasClass('active')) {
... ... @@ -48,6 +32,14 @@ class SelectCouponController extends Page {
this.view.filterBtn.removeClass('active');
itemClicked.addClass('active');
}
if (itemClicked.hasClass('valid')) {
this.view.unusableCouponList.addClass('hide');
this.view.usableCouponList.removeClass('hide');
} else {
this.view.usableCouponList.addClass('hide');
this.view.unusableCouponList.removeClass('hide');
}
}
/**
... ... @@ -69,19 +61,6 @@ class SelectCouponController extends Page {
closeTip() {
this.view.tipBox.hide();
}
/**
* 展示筛选器
*/
showFilter() {
if (this.view.filterItem.hasClass('hide')) {
this.view.filterItem.removeClass('hide');
this.view.showFilterBtn.removeClass('icon-down').addClass('icon-up');
} else {
this.view.filterItem.addClass('hide');
this.view.showFilterBtn.removeClass('icon-up').addClass('icon-down');
}
}
}
export default SelectCouponController;
... ...
... ... @@ -87,6 +87,15 @@ body {
.coupon-list {
padding: 20px;
.coupon-list-type {
width: 100%;
font-size: 24px;
text-align: center;
color: #444;
margin-top: 10px;
margin-bottom: 30px;
}
.coupon {
width: 710px;
height: 200px;
... ... @@ -129,6 +138,18 @@ body {
flex: 1;
}
.type-shop {
color: #efaf46;
}
.type-activity {
color: #fc5960;
}
.type-freight {
color: #222;
}
.info > .title {
font-size: 24px;
color: #444;
... ...