Merge branch 'feature/coupon' into 'release/180420'
Feature/coupon See merge request !1331
Showing
7 changed files
with
53 additions
and
19 deletions
1 | {{#result}} | 1 | {{#result}} |
2 | <section> | 2 | <section> |
3 | <div class="filter-box"> | 3 | <div class="filter-box"> |
4 | - <span class="filter-btn valid active">可用({{usableCouponNumStr}})</span> | ||
5 | - <span class="filter-btn invalid">不可用({{unusableCouponNumStr}})</span> | 4 | + <span class="filter-btn valid active" data-num="{{usableCouponNumStr}}">可用({{usableCouponNumStr}})</span> |
5 | + <span class="filter-btn invalid" data-num="{{unusableCouponNumStr}}">不可用({{unusableCouponNumStr}})</span> | ||
6 | </div> | 6 | </div> |
7 | <div class="exchange-box"> | 7 | <div class="exchange-box"> |
8 | <input type="text" name="couponCodeInput" placeholder="请输入优惠券码"> | 8 | <input type="text" name="couponCodeInput" placeholder="请输入优惠券码"> |
9 | <button id="exchangeCouponBtn" class="exchange-coupon-btn">兑换</button> | 9 | <button id="exchangeCouponBtn" class="exchange-coupon-btn">兑换</button> |
10 | </div> | 10 | </div> |
11 | - <div class="tip-box"> | 11 | + <div class="tip-box{{#if noShowTips}} hide{{/if}}"> |
12 | <div class="tips"> | 12 | <div class="tips"> |
13 | {{{headMsg}}} | 13 | {{{headMsg}}} |
14 | </div> | 14 | </div> |
@@ -21,12 +21,11 @@ | @@ -21,12 +21,11 @@ | ||
21 | {{#each ./coupons}} | 21 | {{#each ./coupons}} |
22 | <div class="coupon{{#isEqualOr is_selected_support 'N'}} no-support-selected{{/isEqualOr}}" data-code="{{coupon_code}}"> | 22 | <div class="coupon{{#isEqualOr is_selected_support 'N'}} no-support-selected{{/isEqualOr}}" data-code="{{coupon_code}}"> |
23 | <div class="coupon-left{{#isEqualOr is_selected_support 'Y'}} | 23 | <div class="coupon-left{{#isEqualOr is_selected_support 'Y'}} |
24 | - {{#isEqualOr coupon_type '1'}} coupon-left-activity{{/isEqualOr}} | 24 | + {{#isEqualOr coupon_type '1' '3' '8'}} coupon-left-activity{{/isEqualOr}} |
25 | {{#isEqualOr coupon_type '5'}} coupon-left-freight{{/isEqualOr}} | 25 | {{#isEqualOr coupon_type '5'}} coupon-left-freight{{/isEqualOr}} |
26 | {{#isEqualOr coupon_type '6'}} coupon-left-shop{{/isEqualOr}} | 26 | {{#isEqualOr coupon_type '6'}} coupon-left-shop{{/isEqualOr}} |
27 | {{/isEqualOr}}"> | 27 | {{/isEqualOr}}"> |
28 | <p class="value"> | 28 | <p class="value"> |
29 | - {{#isEqualOr coupon_type '1' '3' '6'}}¥{{/isEqualOr}} | ||
30 | <span>{{coupon_value_str}}</span> | 29 | <span>{{coupon_value_str}}</span> |
31 | </p> | 30 | </p> |
32 | <p class="threshold">{{use_rule}}</p> | 31 | <p class="threshold">{{use_rule}}</p> |
@@ -55,12 +54,13 @@ | @@ -55,12 +54,13 @@ | ||
55 | </div> | 54 | </div> |
56 | <div class="coupon-list unusable hide"> | 55 | <div class="coupon-list unusable hide"> |
57 | {{#unusableCouponsList}} | 56 | {{#unusableCouponsList}} |
57 | + {{#if ./name}} | ||
58 | <div class="coupon-list-type"><hr><span>{{./name}}</span><hr></div> | 58 | <div class="coupon-list-type"><hr><span>{{./name}}</span><hr></div> |
59 | + {{/if}} | ||
59 | {{#each ./coupons}} | 60 | {{#each ./coupons}} |
60 | <div class="coupon"> | 61 | <div class="coupon"> |
61 | - <div class="coupon-left{{#isEqualOr coupon_type '1' '3'}} coupon-left-activity{{/isEqualOr}}{{#isEqualOr coupon_type '5'}} coupon-left-freight{{/isEqualOr}}{{#isEqualOr coupon_type '6'}} coupon-left-shop{{/isEqualOr}}"> | 62 | + <div class="coupon-left{{#isEqualOr coupon_type '1' '3' '8'}} coupon-left-activity{{/isEqualOr}}{{#isEqualOr coupon_type '5'}} coupon-left-freight{{/isEqualOr}}{{#isEqualOr coupon_type '6'}} coupon-left-shop{{/isEqualOr}}"> |
62 | <p class="value"> | 63 | <p class="value"> |
63 | - {{#isEqualOr coupon_type '1' '3' '6'}}¥{{/isEqualOr}} | ||
64 | <span>{{coupon_value_str}}</span> | 64 | <span>{{coupon_value_str}}</span> |
65 | </p> | 65 | </p> |
66 | <p class="threshold">{{use_rule}}</p> | 66 | <p class="threshold">{{use_rule}}</p> |
@@ -68,7 +68,7 @@ | @@ -68,7 +68,7 @@ | ||
68 | <div class="coupon-right"> | 68 | <div class="coupon-right"> |
69 | <div class="info"> | 69 | <div class="info"> |
70 | <p class="title"> | 70 | <p class="title"> |
71 | - <span class="{{#isEqualOr coupon_type '1' '3'}} type-activity{{/isEqualOr}}{{#isEqualOr coupon_type '5'}} type-freight{{/isEqualOr}}{{#isEqualOr coupon_type '6'}} type-shop{{/isEqualOr}}">[{{catalog_name}}]</span> {{coupon_name}}</p> | 71 | + <span class="{{#isEqualOr coupon_type '1' '3' '8'}} type-activity{{/isEqualOr}}{{#isEqualOr coupon_type '5'}} type-freight{{/isEqualOr}}{{#isEqualOr coupon_type '6'}} type-shop{{/isEqualOr}}">[{{catalog_name}}]</span> {{coupon_name}}</p> |
72 | <p class="time">{{coupon_validity}}</p> | 72 | <p class="time">{{coupon_validity}}</p> |
73 | <p class="desc unusable-desc">{{desc}}</p> | 73 | <p class="desc unusable-desc">{{desc}}</p> |
74 | </div> | 74 | </div> |
@@ -80,7 +80,7 @@ | @@ -80,7 +80,7 @@ | ||
80 | {{/each}} | 80 | {{/each}} |
81 | {{/ unusableCouponsList}} | 81 | {{/ unusableCouponsList}} |
82 | </div> | 82 | </div> |
83 | - <div class="use-now"> | 83 | + <div class="use-now" id="useNowBox"> |
84 | {{#couponPay}} | 84 | {{#couponPay}} |
85 | <div class="left-info"> | 85 | <div class="left-info"> |
86 | <p>已选择 | 86 | <p>已选择 |
1 | -<div id="conponDialogWrapper" class="dialog-wrapper"> | 1 | +<div id="conponDialogWrapper" class="dialog-wrapper conpon-diaalog-wrapper"> |
2 | <div class="dialog-box" style="top: 50%; margin-top: -119px;"> | 2 | <div class="dialog-box" style="top: 50%; margin-top: -119px;"> |
3 | <div class="dialog-header">优惠券使用规则</div> | 3 | <div class="dialog-header">优惠券使用规则</div> |
4 | <div class="dialog-content">{{{couponPayRule}}}</div> | 4 | <div class="dialog-content">{{{couponPayRule}}}</div> |
1 | <section class="coupon-section" data-code="{{coupon_code}}" data-id="{{coupon_id}}"> | 1 | <section class="coupon-section" data-code="{{coupon_code}}" data-id="{{coupon_id}}"> |
2 | <div class="coupon{{#isEqualOr is_overtime 'Y'}} coupon-overtime{{/isEqualOr}}{{#if is_used}} coupon-used{{/if}}"> | 2 | <div class="coupon{{#isEqualOr is_overtime 'Y'}} coupon-overtime{{/isEqualOr}}{{#if is_used}} coupon-used{{/if}}"> |
3 | - <div class="coupon-left{{#unless usedOrOvertime}}{{#isEqualOr coupon_type '1' '3'}} coupon-left-activity{{/isEqualOr}}{{#isEqualOr coupon_type '5'}} coupon-left-freight{{/isEqualOr}}{{#isEqualOr coupon_type '6'}} coupon-left-shop{{/isEqualOr}}{{/unless}}"> | ||
4 | - <p class="value">{{#unlessor coupon_type '5'}}¥{{/unlessor}}<span>{{coupon_value_str}}</span></p> | 3 | + <div class="coupon-left{{#unless usedOrOvertime}}{{#isEqualOr coupon_type '1' '3' '8'}} coupon-left-activity{{/isEqualOr}}{{#isEqualOr coupon_type '5'}} coupon-left-freight{{/isEqualOr}}{{#isEqualOr coupon_type '6'}} coupon-left-shop{{/isEqualOr}}{{/unless}}"> |
4 | + <p class="value"><span>{{coupon_value_str}}</span></p> | ||
5 | {{#if use_rule}} | 5 | {{#if use_rule}} |
6 | <p class="threshold">{{use_rule}}</p> | 6 | <p class="threshold">{{use_rule}}</p> |
7 | {{/if}} | 7 | {{/if}} |
@@ -13,6 +13,7 @@ class SelectCouponController extends Page { | @@ -13,6 +13,7 @@ class SelectCouponController extends Page { | ||
13 | this.useCouponCodeUrl = params.useCouponCodeUrl; | 13 | this.useCouponCodeUrl = params.useCouponCodeUrl; |
14 | this.selectCouponCodes = []; | 14 | this.selectCouponCodes = []; |
15 | this.isBuyNowPage = params.isBuyNowPage || false; | 15 | this.isBuyNowPage = params.isBuyNowPage || false; |
16 | + this.closeTipbyUser = false; | ||
16 | 17 | ||
17 | if (this.orderInfo('coupon_code')) { | 18 | if (this.orderInfo('coupon_code')) { |
18 | this.selectCouponCodes = this.orderInfo('coupon_code').split(','); | 19 | this.selectCouponCodes = this.orderInfo('coupon_code').split(','); |
@@ -65,7 +66,9 @@ class SelectCouponController extends Page { | @@ -65,7 +66,9 @@ class SelectCouponController extends Page { | ||
65 | unusableCouponList: resultHtml.find('.unusable'), | 66 | unusableCouponList: resultHtml.find('.unusable'), |
66 | useNowBtn: resultHtml.find('#useNowBtn'), | 67 | useNowBtn: resultHtml.find('#useNowBtn'), |
67 | exchangeCouponBtn: resultHtml.find('#exchangeCouponBtn'), | 68 | exchangeCouponBtn: resultHtml.find('#exchangeCouponBtn'), |
68 | - couponCodeInput: resultHtml.find('input[name=couponCodeInput]') | 69 | + couponCodeInput: resultHtml.find('input[name=couponCodeInput]'), |
70 | + exchangeBox: resultHtml.find('.exchange-box'), | ||
71 | + useNowBox: resultHtml.find('#useNowBox') | ||
69 | }; | 72 | }; |
70 | 73 | ||
71 | this.view.filterBtn.on('click', this.tabChange.bind(this)); | 74 | this.view.filterBtn.on('click', this.tabChange.bind(this)); |
@@ -135,6 +138,8 @@ class SelectCouponController extends Page { | @@ -135,6 +138,8 @@ class SelectCouponController extends Page { | ||
135 | tabChange(event) { | 138 | tabChange(event) { |
136 | let itemClicked = $(event.currentTarget); | 139 | let itemClicked = $(event.currentTarget); |
137 | 140 | ||
141 | + console.log(this.view.useNowBox); | ||
142 | + | ||
138 | if (itemClicked.hasClass('active')) { | 143 | if (itemClicked.hasClass('active')) { |
139 | itemClicked.removeClass('active'); | 144 | itemClicked.removeClass('active'); |
140 | } else { | 145 | } else { |
@@ -145,9 +150,19 @@ class SelectCouponController extends Page { | @@ -145,9 +150,19 @@ class SelectCouponController extends Page { | ||
145 | if (itemClicked.hasClass('valid')) { | 150 | if (itemClicked.hasClass('valid')) { |
146 | this.view.unusableCouponList.addClass('hide'); | 151 | this.view.unusableCouponList.addClass('hide'); |
147 | this.view.usableCouponList.removeClass('hide'); | 152 | this.view.usableCouponList.removeClass('hide'); |
153 | + this.view.exchangeBox.removeClass('hide'); | ||
154 | + this.view.useNowBox.removeClass('hide'); | ||
148 | } else { | 155 | } else { |
149 | this.view.usableCouponList.addClass('hide'); | 156 | this.view.usableCouponList.addClass('hide'); |
150 | this.view.unusableCouponList.removeClass('hide'); | 157 | this.view.unusableCouponList.removeClass('hide'); |
158 | + this.view.exchangeBox.addClass('hide'); | ||
159 | + this.view.useNowBox.addClass('hide'); | ||
160 | + } | ||
161 | + | ||
162 | + if (itemClicked.data('num') === 0) { | ||
163 | + this.view.tipBox.addClass('hide'); | ||
164 | + } else if (!this.closeTipbyUser) { | ||
165 | + this.view.tipBox.removeClass('hide'); | ||
151 | } | 166 | } |
152 | } | 167 | } |
153 | 168 | ||
@@ -176,6 +191,7 @@ class SelectCouponController extends Page { | @@ -176,6 +191,7 @@ class SelectCouponController extends Page { | ||
176 | * 关闭提示框 | 191 | * 关闭提示框 |
177 | */ | 192 | */ |
178 | closeTip() { | 193 | closeTip() { |
194 | + this.closeTipbyUser = true; | ||
179 | this.view.tipBox.hide(); | 195 | this.view.tipBox.hide(); |
180 | } | 196 | } |
181 | } | 197 | } |
@@ -172,6 +172,9 @@ body { | @@ -172,6 +172,9 @@ body { | ||
172 | font-size: 22px; | 172 | font-size: 22px; |
173 | color: #b0b0b0; | 173 | color: #b0b0b0; |
174 | position: relative; | 174 | position: relative; |
175 | + display: flex; | ||
176 | + flex-direction: column; | ||
177 | + align-content: space-between; | ||
175 | 178 | ||
176 | .type-shop { | 179 | .type-shop { |
177 | color: #efaf46; | 180 | color: #efaf46; |
@@ -186,12 +189,13 @@ body { | @@ -186,12 +189,13 @@ body { | ||
186 | } | 189 | } |
187 | 190 | ||
188 | .title { | 191 | .title { |
192 | + width: 400px; | ||
189 | font-size: 24px; | 193 | font-size: 24px; |
190 | color: #444; | 194 | color: #444; |
191 | - margin-bottom: 40px; | 195 | + display: -webkit-box; |
196 | + -webkit-box-orient: vertical; | ||
197 | + -webkit-line-clamp: 2; | ||
192 | overflow: hidden; | 198 | overflow: hidden; |
193 | - white-space: nowrap; | ||
194 | - text-overflow: ellipsis; | ||
195 | } | 199 | } |
196 | 200 | ||
197 | .time { | 201 | .time { |
@@ -357,7 +357,7 @@ function handleCoupons(params) { | @@ -357,7 +357,7 @@ function handleCoupons(params) { | ||
357 | } | 357 | } |
358 | 358 | ||
359 | if (validCouponCount && couponData.coupon_count) { | 359 | if (validCouponCount && couponData.coupon_count) { |
360 | - showText = `可用${validCouponCount}张 已推荐${couponData.coupon_count}张`; | 360 | + showText = `${validCouponCount}张可用 已推荐${couponData.coupon_count}张`; |
361 | priceText = `-¥${couponData.coupon_amount_str}`; | 361 | priceText = `-¥${couponData.coupon_amount_str}`; |
362 | } | 362 | } |
363 | 363 | ||
@@ -387,10 +387,13 @@ const couponProcess = conponData => { | @@ -387,10 +387,13 @@ const couponProcess = conponData => { | ||
387 | let headMsg = _.replace(_.get(conponData, 'usable_coupon_catalogs.head_msg', []), '\n', '<br>'); | 387 | let headMsg = _.replace(_.get(conponData, 'usable_coupon_catalogs.head_msg', []), '\n', '<br>'); |
388 | let usableCouponNumStr = ''; | 388 | let usableCouponNumStr = ''; |
389 | let unusableCouponNumStr = ''; | 389 | let unusableCouponNumStr = ''; |
390 | + let noShowTips = true; | ||
390 | 391 | ||
391 | _.forEach(unusableCouponsList, listItem => { | 392 | _.forEach(unusableCouponsList, listItem => { |
392 | - if (listItem.coupons) { | 393 | + if (listItem.coupons && listItem.coupons.length) { |
393 | unusableCouponNum += listItem.coupons.length; | 394 | unusableCouponNum += listItem.coupons.length; |
395 | + } else { | ||
396 | + listItem.name = ''; | ||
394 | } | 397 | } |
395 | }); | 398 | }); |
396 | 399 | ||
@@ -406,13 +409,18 @@ const couponProcess = conponData => { | @@ -406,13 +409,18 @@ const couponProcess = conponData => { | ||
406 | unusableCouponNumStr = unusableCouponNum + ''; | 409 | unusableCouponNumStr = unusableCouponNum + ''; |
407 | } | 410 | } |
408 | 411 | ||
412 | + if (!usableCouponNum) { | ||
413 | + noShowTips = true; | ||
414 | + } | ||
415 | + | ||
409 | return { | 416 | return { |
410 | usableCouponNumStr, | 417 | usableCouponNumStr, |
411 | unusableCouponNumStr, | 418 | unusableCouponNumStr, |
412 | usableCouponsList, | 419 | usableCouponsList, |
413 | unusableCouponsList, | 420 | unusableCouponsList, |
414 | couponPay, | 421 | couponPay, |
415 | - headMsg | 422 | + headMsg, |
423 | + noShowTips | ||
416 | }; | 424 | }; |
417 | }; | 425 | }; |
418 | 426 |
-
Please register or login to post a comment