fe / yohobuy-node · Commits

Go to a project

Authored by yyq
Commit 44289660b62ef24b09bf35566f5c2ce60a9217b4 2 parents ad541ae3 cede5a1f

Merge branch 'feature/freeShipping' of git.yoho.cn:fe/yohobuy-node into feature/freeShipping

Inline Side-by-side
Showing 10 changed files with 156 additions and 97 deletions
@@ -43,6 +43,7 @@ module.exports = class extends global.yoho.BaseModel { @@ -43,6 +43,7 @@ module.exports = class extends global.yoho.BaseModel {
43 result[i] = {}; 43 result[i] = {};
44 result[i].id = item.couponId; 44 result[i].id = item.couponId;
45 result[i].code = item.couponCode; 45 result[i].code = item.couponCode;
  46 + result[i].couponType = Number(item.couponType);
46 47
47 // 格式化有效日期 "couponValidity": "2016.03.15-2016.03.31" 48 // 格式化有效日期 "couponValidity": "2016.03.15-2016.03.31"
48 let dates = item.couponValidity.split('-'), 49 let dates = item.couponValidity.split('-'),
@@ -90,11 +91,9 @@ module.exports = class extends global.yoho.BaseModel { @@ -90,11 +91,9 @@ module.exports = class extends global.yoho.BaseModel {
90 } else { 91 } else {
91 result[i].status = item.isValidity ? '可使用' : '已过期'; 92 result[i].status = item.isValidity ? '可使用' : '已过期';
92 } 93 }
  94 +
93 if (item.couponType) { 95 if (item.couponType) {
94 result[i].type = item.couponType; 96 result[i].type = item.couponType;
95 - if (Number(item.couponType) === 5) {  
96 - result[i].value = '免邮';  
97 - }  
98 } 97 }
99 }); 98 });
100 } 99 }
@@ -24,26 +24,30 @@ @@ -24,26 +24,30 @@
24 {{# unUseCoupons}} 24 {{# unUseCoupons}}
25 {{#unless empty}} 25 {{#unless empty}}
26 <div class="coupon" data-couponId="{{id}}"> 26 <div class="coupon" data-couponId="{{id}}">
27 - <div class="coupons-name">  
28 - <div class="coupons-card coupons-notuse">  
29 - <div class="coupons-date clearfix">  
30 - <p class="left">{{useRemark}}</p>  
31 - <p class="right">{{overState}}</p>  
32 - </div>  
33 - <div class="coupons-num clearfix">  
34 - <div class="left coupons-sht"> 27 + <div class="coupons-card{{#isEqual couponType 5}} coupons-freight{{/isEqual}}">
  28 + <div class="coupons-card-header">
  29 + <p class="left-title">{{useRemark}}</p>
  30 + <p class="right-title">{{overState}}</p>
  31 + </div>
  32 + <div class="coupons-card-content">
  33 + <div class="coupons-card-row">
  34 + <div class="coupons-sht">
35 <p class="coupons-price">{{value}}</p> 35 <p class="coupons-price">{{value}}</p>
36 - <p class="coupons-full">{{rule}}</p> 36 + {{#if rule}}
  37 + <p class="coupons-full" title="{{rule}}">{{rule}}</p>
  38 + {{/if}}
37 </div> 39 </div>
38 - <div class="left coupons-dtl">{{beginTime}} - {{endTime}}</div> 40 + <div class="coupons-dtl">{{beginTime}} - {{endTime}}</div>
39 </div> 41 </div>
40 </div> 42 </div>
41 </div> 43 </div>
  44 +
42 <div class="coupons-info"> 45 <div class="coupons-info">
43 <div class="coupons-text"> 46 <div class="coupons-text">
44 {{notes}} 47 {{notes}}
45 </div> 48 </div>
46 </div> 49 </div>
  50 +
47 <div class="coupons-opt"> 51 <div class="coupons-opt">
48 <a class="btn use-btn" id="coupon-use" href="{{proListUrl}}" target="_black">立即使用</a> 52 <a class="btn use-btn" id="coupon-use" href="{{proListUrl}}" target="_black">立即使用</a>
49 </div> 53 </div>
@@ -54,17 +58,20 @@ @@ -54,17 +58,20 @@
54 {{# usedCoupons}} 58 {{# usedCoupons}}
55 {{#unless empty}} 59 {{#unless empty}}
56 <div class="coupon" data-couponId="{{id}}"> 60 <div class="coupon" data-couponId="{{id}}">
57 - <div class="coupons-name">  
58 - <div class="coupons-card coupons-use">  
59 - <div class="coupons-date clearfix">  
60 - <p class="left">{{useRemark}}</p>  
61 - </div>  
62 - <div class="coupons-num clearfix">  
63 - <div class="left coupons-sht"> 61 + <div class="coupons-card coupons-use{{#isEqual couponType 5}} coupons-freight{{/isEqual}}">
  62 + <div class="coupons-card-header">
  63 + <p class="left-title">{{useRemark}}</p>
  64 + <p class="right-title">{{overState}}</p>
  65 + </div>
  66 + <div class="coupons-card-content">
  67 + <div class="coupons-card-row">
  68 + <div class="coupons-sht">
64 <p class="coupons-price">{{value}}</p> 69 <p class="coupons-price">{{value}}</p>
65 - <p class="coupons-full">{{rule}}</p> 70 + {{#if rule}}
  71 + <p class="coupons-full" title="{{rule}}">{{rule}}</p>
  72 + {{/if}}
66 </div> 73 </div>
67 - <div class="left coupons-dtl">{{beginTime}} - {{endTime}}</div> 74 + <div class="coupons-dtl">{{beginTime}} - {{endTime}}</div>
68 </div> 75 </div>
69 </div> 76 </div>
70 </div> 77 </div>
@@ -90,17 +97,20 @@ @@ -90,17 +97,20 @@
90 {{# noValidCoupons}} 97 {{# noValidCoupons}}
91 {{#unless empty}} 98 {{#unless empty}}
92 <div class="coupon" data-couponId="{{id}}"> 99 <div class="coupon" data-couponId="{{id}}">
93 - <div class="coupons-name">  
94 - <div class="coupons-card coupons-overtime">  
95 - <div class="coupons-date clearfix">  
96 - <p class="left">{{useRemark}}</p>  
97 - </div>  
98 - <div class="coupons-num clearfix">  
99 - <div class="left coupons-sht"> 100 + <div class="coupons-card coupons-invalid">
  101 + <div class="coupons-card-header">
  102 + <p class="left-title">{{useRemark}}</p>
  103 + <p class="right-title">{{overState}}</p>
  104 + </div>
  105 + <div class="coupons-card-content">
  106 + <div class="coupons-card-row">
  107 + <div class="coupons-sht">
100 <p class="coupons-price">{{value}}</p> 108 <p class="coupons-price">{{value}}</p>
101 - <p class="coupons-full">{{rule}}</p> 109 + {{#if rule}}
  110 + <p class="coupons-full" title="{{rule}}">{{rule}}</p>
  111 + {{/if}}
102 </div> 112 </div>
103 - <div class="left coupons-dtl">{{beginTime}} - {{endTime}}</div> 113 + <div class="coupons-dtl">{{beginTime}} - {{endTime}}</div>
104 </div> 114 </div>
105 </div> 115 </div>
106 </div> 116 </div>

6.56 KB | W: | H:

2.92 KB | W: | H:

  • 2-up
  • Swipe
  • Onion skin
@@ -11,41 +11,41 @@ @@ -11,41 +11,41 @@
11 border: 1px solid #e6e6e6; 11 border: 1px solid #e6e6e6;
12 margin: 0 auto 10px; 12 margin: 0 auto 10px;
13 13
14 - .coupons-name {  
15 - width: 240px;  
16 - } 14 + .coupons-header {
  15 + height: 25px;
  16 + padding: 0 20px;
  17 + line-height: 25px;
  18 + text-align: center;
  19 + border-bottom: 1px solid #e6e6e6;
  20 + background: #efefef;
17 21
18 - .coupons-info {  
19 - width: 388px; 22 + span {
  23 + display: block;
  24 + float: left;
  25 + }
20 26
21 - .coupons-text {  
22 - color: #000;  
23 - padding: 0 25px;  
24 - text-align: left; 27 + span.coupons-name {
  28 + width: 241px;
25 } 29 }
26 - }  
27 30
28 - .coupons-opt {  
29 - width: 100px;  
30 - color: #000;  
31 - }  
32 - } 31 + span.coupons-info {
  32 + width: 388px;
33 33
34 - .coupons-header {  
35 - height: 25px;  
36 - padding: 0 20px;  
37 - line-height: 25px;  
38 - text-align: center;  
39 - border-bottom: 1px solid #e6e6e6;  
40 - background: #efefef; 34 + .coupons-text {
  35 + color: #000;
  36 + padding: 0 25px;
  37 + text-align: left;
  38 + }
  39 + }
41 40
42 - span {  
43 - display: block;  
44 - float: left; 41 + span.coupons-opt {
  42 + width: 100px;
  43 + color: #000;
  44 + }
45 } 45 }
46 } 46 }
47 47
48 - .coupon { 48 + .coupons-wrap .coupon {
49 display: table; 49 display: table;
50 border-bottom: 1px solid #e6e6e6; 50 border-bottom: 1px solid #e6e6e6;
51 width: 736px; 51 width: 736px;
@@ -69,69 +69,119 @@ @@ -69,69 +69,119 @@
69 } 69 }
70 70
71 .coupons-card { 71 .coupons-card {
72 - width: 240px; 72 + width: 221px;
73 height: 80px; 73 height: 80px;
74 - color: #fff; 74 + display: table;
  75 + table-layout: fixed;
  76 + text-align: left;
  77 + padding: 0 10px;
  78 + background-image: resolve(home/coupons1.png);
  79 + background-repeat: no-repeat;
  80 +
  81 + .coupons-card-header {
  82 + height: 20px;
  83 + color: #fff;
  84 + overflow: hidden;
75 85
76 - &.coupons-notuse {  
77 - background-image: resolve(home/notuse.png); 86 + p.left-title {
  87 + width: 160px;
  88 + overflow: hidden;
  89 + text-overflow: ellipsis;
  90 + white-space: nowrap;
  91 + float: left;
  92 + }
78 93
79 - .coupons-dtl {  
80 - width: 150px; 94 + p.right-title {
  95 + width: 61px;
  96 + overflow: hidden;
  97 + text-overflow: ellipsis;
  98 + white-space: nowrap;
  99 + float: right;
81 } 100 }
82 } 101 }
83 102
84 - &.coupons-use {  
85 - background-image: resolve(home/use.png); 103 + .coupons-card-content {
  104 + height: 60px;
  105 + display: table;
  106 + overflow: hidden;
86 } 107 }
87 108
88 - &.coupons-overtime {  
89 - background-image: resolve(home/overtime.png); 109 + .coupons-card-content .coupons-card-row {
  110 + display: table-row;
90 } 111 }
91 112
92 - .coupons-date {  
93 - padding: 0 10px; 113 + .coupons-card-content .coupons-card-row .coupons-sht {
  114 + display: table-cell;
  115 + width: 65px;
  116 + vertical-align: middle;
  117 + text-align: center;
  118 + font-size: 12px;
94 119
95 - & > p {  
96 - height: 20px; 120 + p {
  121 + white-space: nowrap;
97 overflow: hidden; 122 overflow: hidden;
98 text-overflow: ellipsis; 123 text-overflow: ellipsis;
99 - white-space: nowrap;  
100 - text-align: left; 124 + display: inline-block;
  125 + width: inherit;
  126 + vertical-align: bottom;
101 } 127 }
102 128
103 - p.left {  
104 - width: 70%; 129 + .coupons-price {
  130 + vertical-align: sub;
  131 + font-size: 24px;
  132 + font-weight: bold;
105 } 133 }
  134 + }
106 135
107 - p.right {  
108 - width: 30%;  
109 - } 136 + .coupons-card-content .coupons-card-row .coupons-full {
  137 + display: table-cell;
  138 + vertical-align: middle;
110 } 139 }
111 140
112 - .coupons-num {  
113 - margin-top: 10px; 141 + .coupons-card-content .coupons-card-row .coupons-dtl {
  142 + display: table-cell;
  143 + padding-left: 10px;
  144 + padding-top: 17px;
  145 + font-weight: bold;
  146 + }
  147 + }
114 148
115 - .coupons-sht {  
116 - width: 70px;  
117 - } 149 + .coupons-freight {
  150 + background-image: resolve(home/coupons2.png);
  151 + }
118 152
119 - .coupons-sht .coupons-price {  
120 - font-size: 20px;  
121 - line-height: 24px;  
122 - } 153 + .coupons-use {
  154 + &:before {
  155 + content: "";
  156 + background-image: resolve(home/use.png);
  157 + background-repeat: no-repeat;
  158 + width: 55px;
  159 + height: 48px;
  160 + position: absolute;
  161 + margin-left: 148px;
  162 + margin-top: 25px;
  163 + }
  164 + }
123 165
124 - .coupons-dtl {  
125 - width: 100px;  
126 - height: 45px;  
127 - margin-left: 5px;  
128 - line-height: 23px;  
129 - text-align: left;  
130 - overflow: hidden;  
131 - } 166 + .coupons-invalid {
  167 + background-image: resolve(home/coupons3.png);
  168 +
  169 + &:before {
  170 + content: "";
  171 + background-image: resolve(home/invalid.png);
  172 + background-repeat: no-repeat;
  173 + width: 55px;
  174 + height: 48px;
  175 + position: absolute;
  176 + margin-left: 148px;
  177 + margin-top: 25px;
132 } 178 }
133 } 179 }
134 180
  181 + .coupons-info {
  182 + width: 388px;
  183 + }
  184 +
135 .coupons-opt { 185 .coupons-opt {
136 .btn { 186 .btn {
137 width: 90px; 187 width: 90px;
@@ -153,11 +203,11 @@ @@ -153,11 +203,11 @@
153 } 203 }
154 } 204 }
155 205
156 - .coupon .end-soon { 206 + .coupons-wrap .coupon .end-soon {
157 color: #e8044f; 207 color: #e8044f;
158 } 208 }
159 209
160 - .un-use-coupons { 210 + .coupons-wrap .un-use-coupons {
161 .coupons-img { 211 .coupons-img {
162 width: 20%; 212 width: 20%;
163 } 213 }