fe / yohobuywap-node · Commits

Go to a project

Authored by 郭成尧
Commit 9b26f877e402ba77dfef775f33696df079386c93 1 parent 144628b1

coupon-selected

Inline Side-by-side
Showing 5 changed files with 107 additions and 73 deletions
... ... @@ -20,6 +20,7 @@ const _couponProcess = conponData => {
let unusableCouponsList = _.get(conponData, 'unusable_coupon_catalogs.list', []);
let usableCouponNum = _.get(usableCouponsList, '[0].coupons.length', 0);
let unusableCouponNum = 0;
let couponPay = _.get(usableCouponsList, '[0].coupon_pay');
let headMsg = _.replace(_.get(conponData, 'usable_coupon_catalogs.head_msg', []), '\n', '<br>');
_.forEach(unusableCouponsList, listItem => {
... ... @@ -33,6 +34,7 @@ const _couponProcess = conponData => {
unusableCouponNum,
usableCouponsList,
unusableCouponsList,
couponPay,
headMsg
};
};
... ...
{{#result}}
<div class="filter-box">
<span class="filter-btn valid active">可用({{usableCouponNum}})</span>
<span class="filter-btn invalid">不可用({{unusableCouponNum}})</span>
</div>
<div class="exchange-box">
<input type="text" placeholder="请输入优惠券码">
<button>兑换</button>
</div>
<div class="tip-box">
<div class="tips">
{{{headMsg}}}
<section>
<div class="filter-box">
<span class="filter-btn valid active">可用({{usableCouponNum}})</span>
<span class="filter-btn invalid">不可用({{unusableCouponNum}})</span>
</div>
<div class="tip-close">
<span class="iconfont">&#xe623;</span>
<div class="exchange-box">
<input type="text" placeholder="请输入优惠券码">
<button>兑换</button>
</div>
</div>
<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="coupon-right">
<div class="info">
<p class="title">
<span>[{{catalog_name}}]</span> {{coupon_name}}</p>
<p class="time">{{coupon_validity}}</p>
<div class="tip-box">
<div class="tips">
{{{headMsg}}}
</div>
<div class="tip-close">
<span class="iconfont">&#xe623;</span>
</div>
</div>
<div class="coupon-list usable">
{{#usableCouponsList}}
{{#each ./coupons}}
<div class="coupon{{#isEqualOr is_selected_support 'N'}} no-support-selected{{/isEqualOr}}" 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{{#isEqualOr selected 'Y'}} icon-cb-radio{{^}} icon-radio{{/isEqualOr}}"></span>
<div class="coupon-right">
<div class="info">
<p class="title">
<span>[{{catalog_name}}]</span> {{coupon_name}}</p>
<p class="time">{{coupon_validity}}</p>
{{#isEqualOr is_selected_support 'N'}}
<p class="desc">{{desc}}</p>
{{/isEqualOr}}
</div>
<div class="check">
{{#isEqualOr is_selected_support 'Y'}}
<span class="iconfont checkbox{{#isEqualOr selected 'Y'}} icon-cb-radio{{^}} icon-radio{{/isEqualOr}}"></span>
{{^}}
<span class="iconfont icon-point1"></span>
{{/isEqualOr}}
</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>
{{/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>
</div>
{{/each}}
{{/ unusableCouponsList}}
</div>
<div class="use-now">
<div class="left-info">
<p>已选择
<span class="nums">5</span> 张，共优惠
<span class="nums">415.00</span> 元</p>
<p>待支付
<span class="nums">499.00</span> 元</p>
{{/each}}
{{/ unusableCouponsList}}
</div>
<div class="use-now">
{{#couponPay}}
<div class="left-info">
<p>已选择
<span class="nums">{{coupon_count}}</span> 张，共优惠
<span class="nums">{{coupon_amount_str}}</span> 元</p>
<p>待支付
<span class="nums">{{to_pay_amount_str}}</span> 元</p>
</div>
{{/ couponPay}}
<button class="use-now-btn" id="useNowBtn">立即使用</button>
</div>
<button class="use-now-btn" id="useNowBtn">立即使用</button>
</div>
{{/ result}}
{{/ result}}
</section>
... ...
... ... @@ -62,9 +62,7 @@ class SelectCouponController extends Page {
* 使用优惠券
*/
useCoupon() {
console.log('处理选中优惠券...');
console.log('提交接口...');
console.log('返回结算页...');
window.history.go(-1);
}
/**
... ...
... ... @@ -158,7 +158,12 @@ body {
}
.info > .time {
margin-bottom: 26px;
margin-bottom: 8px;
}
.info > .desc {
font-size: 20px;
color: #444;
}
.check {
... ... @@ -172,6 +177,20 @@ body {
font-size: 40px;
color: #444;
}
.check > .icon-point1 {
color: #b0b0b0;
}
}
}
.no-support-selected {
> .coupon-left > p {
color: #b0b0b0;
}
> .coupon-right .info > .title {
color: #b0b0b0;
}
}
}
... ...
... ... @@ -222,6 +222,10 @@ button {
content: "\e699";
}
.icon-point1:before {
content: "\e60c";
}
.wx-footer-c {
margin-top: 30px;
}
... ...