Authored by 陈峰

Merge branch 'feature/activity-product-group' into 'release/6.8.3'

Feature/activity product group

活动模版优化

See merge request !1602
@@ -82,12 +82,34 @@ class featureModel extends global.yoho.BaseModel { @@ -82,12 +82,34 @@ class featureModel extends global.yoho.BaseModel {
82 vipBgColor: value.vipBgColor, 82 vipBgColor: value.vipBgColor,
83 showVipPrice: value.showVipPrice, 83 showVipPrice: value.showVipPrice,
84 brandImg: value.brandImg, 84 brandImg: value.brandImg,
85 - showBrandUrl: value.showBrandUrl 85 + showBrandUrl: value.showBrandUrl,
  86 + isAdvance: value.isAdvance,
  87 + advanceBgImg: value.advanceBgImg,
  88 + leftDownImg: value.leftDownImg
86 }; 89 };
87 90
88 value._defaultSkns && value._defaultSkns.forEach(val => { 91 value._defaultSkns && value._defaultSkns.forEach(val => {
89 let pro = resList[val]; 92 let pro = resList[val];
90 93
  94 + if (baseConf.isAdvance === '1') {
  95 + let plan = pro.product_price_plan_list;
  96 +
  97 + if (plan.length) {
  98 + let time = Math.round(new Date() / 1000);
  99 + let effectPlan = [];
  100 +
  101 + plan.forEach(planItem => {
  102 + if (planItem.effect_time > time) {
  103 + effectPlan.push(planItem);
  104 + }
  105 + });
  106 +
  107 + if (effectPlan.length && time > effectPlan[0].show_begin_time && effectPlan[0].show_status === '1') { // eslint-disable-line
  108 + pro.curPlanPrice = effectPlan[0].current_saleprice;
  109 + }
  110 + }
  111 + }
  112 +
91 if (pro) { 113 if (pro) {
92 defaultPros.push(Object.assign({conf: baseConf}, pro)); 114 defaultPros.push(Object.assign({conf: baseConf}, pro));
93 } 115 }
1 'use strict'; 1 'use strict';
  2 +const _ = require('lodash');
2 3
3 let _getProduct = function(o) { 4 let _getProduct = function(o) {
4 - return { 5 + let plan = o.product_price_plan_list;
  6 + let res = {
5 small_sort_id: o.small_sort_id, 7 small_sort_id: o.small_sort_id,
6 middle_sort_id: o.middle_sort_id, 8 middle_sort_id: o.middle_sort_id,
7 max_sort_id: o.max_sort_id, 9 max_sort_id: o.max_sort_id,
@@ -21,6 +23,29 @@ let _getProduct = function(o) { @@ -21,6 +23,29 @@ let _getProduct = function(o) {
21 default_images: o.default_images, 23 default_images: o.default_images,
22 goods_id: Array.isArray(o.goods_list) && o.goods_list.length ? o.goods_list[0].goods_id : void 0 24 goods_id: Array.isArray(o.goods_list) && o.goods_list.length ? o.goods_list[0].goods_id : void 0
23 }; 25 };
  26 +
  27 + plan = _.sortBy(plan, item => {
  28 + return +item.show_begin_time;
  29 + });
  30 +
  31 + if (plan.length) {
  32 + let time = Math.round(new Date() / 1000);
  33 + let effectPlan = [];
  34 +
  35 + plan.forEach(planItem => {
  36 + if (planItem.effect_time > time) {
  37 + effectPlan.push(planItem);
  38 + }
  39 + });
  40 +
  41 + if (effectPlan.length && time > effectPlan[0].show_begin_time && effectPlan[0].show_status === '1') { // eslint-disable-line
  42 + o.curPlanPrice = effectPlan[0].current_saleprice;
  43 +
  44 + _.assign(res, {curPlanPrice: effectPlan[0].current_saleprice});
  45 + }
  46 + }
  47 +
  48 + return res;
24 }; 49 };
25 50
26 const gender = { 51 const gender = {
@@ -151,6 +151,10 @@ @@ -151,6 +151,10 @@
151 {{> feature/timed-cut-product}} 151 {{> feature/timed-cut-product}}
152 {{/isEqualOr}} 152 {{/isEqualOr}}
153 153
  154 + {{#isEqualOr type 'redPacket'}}
  155 + {{! 红包领取}}
  156 + {{> feature/red-packet}}
  157 + {{/isEqualOr}}
154 {{#isEqualOr type 'likedActivity'}} 158 {{#isEqualOr type 'likedActivity'}}
155 {{! 点赞楼层}} 159 {{! 点赞楼层}}
156 {{> feature/liked-activity}} 160 {{> feature/liked-activity}}
@@ -22,6 +22,17 @@ @@ -22,6 +22,17 @@
22 <a class="new-brand-name {{#isEqualOr showBrandUrl '1'}}product-brand{{else}}product-detail{{/isEqualOr}}" href=""> 22 <a class="new-brand-name {{#isEqualOr showBrandUrl '1'}}product-brand{{else}}product-detail{{/isEqualOr}}" href="">
23 <span class="brand-name" {{#if fontColor}} style="color:{{fontColor}};" {{/if}}></span> 23 <span class="brand-name" {{#if fontColor}} style="color:{{fontColor}};" {{/if}}></span>
24 </a> 24 </a>
  25 + <div class="sales-imgs-new">
  26 + {{#isEqualOr isAdvance '1'}}
  27 + <div class="advance" style="background-image: url({{advanceBgImg}});">
  28 + <img src="{{advanceBgImg}}" class="img-seat">
  29 + <span class="advance-price"></span>
  30 + </div>
  31 + {{/isEqualOr}}
  32 + {{#if leftDownImg}}
  33 + <img class="leftdownimg lazy" data-original="{{image2 leftDownImg q=85}}">
  34 + {{/if}}
  35 + </div>
25 </div> 36 </div>
26 </a> 37 </a>
27 {{#if brandImg}} 38 {{#if brandImg}}
@@ -8,6 +8,19 @@ @@ -8,6 +8,19 @@
8 <img class="rigtopimg lazy" data-original="{{image2 conf.rigTopImg q=85}}"> 8 <img class="rigtopimg lazy" data-original="{{image2 conf.rigTopImg q=85}}">
9 {{/if}} 9 {{/if}}
10 <img class="product-detail-img lazy" data-original="{{image2 productimg q=85}}"> 10 <img class="product-detail-img lazy" data-original="{{image2 productimg q=85}}">
  11 + <div class="sales-imgs-old">
  12 + {{#isEqualOr conf.isAdvance '1'}}
  13 + {{#if curPlanPrice}}
  14 + <div class="advance" style="background-image: url({{conf.advanceBgImg}});">
  15 + <img src="{{conf.advanceBgImg}}" class="img-seat">
  16 + <span class="advance-price">¥{{curPlanPrice}}</span>
  17 + </div>
  18 + {{/if}}
  19 + {{/isEqualOr}}
  20 + {{#if conf.leftDownImg}}
  21 + <img class="leftdownimg lazy" data-original="{{image2 conf.leftDownImg q=85}}">
  22 + {{/if}}
  23 + </div>
11 </div> 24 </div>
12 {{#isEqualOr conf.showPrdName '1'}} 25 {{#isEqualOr conf.showPrdName '1'}}
13 <p class="product-name">{{productname}}</p> 26 <p class="product-name">{{productname}}</p>
@@ -19,6 +19,17 @@ @@ -19,6 +19,17 @@
19 <img class="rigtopimg" src="{{image2 rigTopImg q=85}}"> 19 <img class="rigtopimg" src="{{image2 rigTopImg q=85}}">
20 {{/if}} 20 {{/if}}
21 <img class="product-detail-img lazy" src=""> 21 <img class="product-detail-img lazy" src="">
  22 + <div class="sales-imgs-old sales-product-pool">
  23 + {{#isEqualOr isAdvance '1'}}
  24 + <div class="advance" style="background-image: url({{advanceBgImg}});">
  25 + <img src="{{advanceBgImg}}" class="img-seat">
  26 + <span class="advance-price"></span>
  27 + </div>
  28 + {{/isEqualOr}}
  29 + {{#if leftDownImg}}
  30 + <img class="leftdownimg lazy" data-original="{{image2 leftDownImg q=85}}">
  31 + {{/if}}
  32 + </div>
22 </div> 33 </div>
23 {{#isEqualOr showPrdName '1'}} 34 {{#isEqualOr showPrdName '1'}}
24 <p class="product-name"></p> 35 <p class="product-name"></p>
  1 +
  2 +
  3 +<a class="redenvelope yoho-redenvelope" href="javascript:;" data-token="{{redPacketToken}}">
  4 +</a>
1 <div class="shop-container{{#isEqualOr numOfOneRow '2'}} shop-two{{^}} shop-three{{/isEqualOr}}"> 1 <div class="shop-container{{#isEqualOr numOfOneRow '2'}} shop-two{{^}} shop-three{{/isEqualOr}}">
2 {{#renderData}} 2 {{#renderData}}
3 {{#isEqualOr ../numOfOneRow '2'}} 3 {{#isEqualOr ../numOfOneRow '2'}}
4 - <a{{#isEqualOr ../jump2Shop '1'}} href="{{href}}"{{/isEqualOr}}class="pull-left shop-box"> 4 + <a{{#isEqualOr ../jump2Shop '1'}} href="{{href}}"{{/isEqualOr}} class="pull-left shop-box">
5 <div class="shop-img"> 5 <div class="shop-img">
6 {{#if ../lefTopImg}} 6 {{#if ../lefTopImg}}
7 <img class="left-icon lazy" data-original="{{image2 ../lefTopImg q=85}}" alt=""> 7 <img class="left-icon lazy" data-original="{{image2 ../lefTopImg q=85}}" alt="">
8 {{/if}} 8 {{/if}}
9 - <img class="lazy" data-original="{{image2 picture w=284 h=320 q=85}}" alt=""> 9 + <img class="lazy" data-original="{{image2 picture w=268 h=224 q=85}}" alt="">
10 </div> 10 </div>
11 - <div class="shop-bottom-bar" style="background-image: url({{image2 ../brandImg w=290 h=60 q=85}})">  
12 - <span class="shop-name">{{shop_name}}</span> 11 + <div class="shop-bottom-bar" style="background-image: url({{image2 ../brandImg w=268 h=60 q=85}})">
  12 + <span class="shop-name" style="{{#if ../shopNameFontColor}}color: {{../shopNameFontColor}}{{/if}}">{{shop_name}}</span>
13 </div> 13 </div>
14 </a> 14 </a>
15 {{^}} 15 {{^}}
16 - <a{{#isEqualOr ../jump2Shop '1'}} href="{{href}}"{{/isEqualOr}}class="pull-left shop-box"> 16 + <a{{#isEqualOr ../jump2Shop '1'}} href="{{href}}"{{/isEqualOr}} class="pull-left shop-box">
17 <div class="shop-img"> 17 <div class="shop-img">
  18 + {{#if ../lefTopImg}}
18 <img class="left-icon lazy" data-original="{{image2 ../lefTopImg q=85}}" alt=""> 19 <img class="left-icon lazy" data-original="{{image2 ../lefTopImg q=85}}" alt="">
19 - <img class="lazy" data-original="{{image2 picture w=188 h=210 q=85}}" alt=""> 20 + {{/if}}
  21 + <img class="lazy" data-original="{{image2 picture w=186 h=156 q=85}}" alt="">
20 </div> 22 </div>
21 - <div class="shop-bottom-bar" style="background-image: url({{image2 ../brandImg w=290 h=60 q=85}});">  
22 - <span class="shop-name">{{shop_name}}</span> 23 + <div class="shop-bottom-bar" style="background-image: url({{image2 ../brandImg w=186 h=40 q=85}});">
  24 + <span class="shop-name" style="{{#if ../shopNameFontColor}}color: {{../shopNameFontColor}}{{/if}}">{{shop_name}}</span>
23 </div> 25 </div>
24 </a> 26 </a>
25 {{/isEqualOr}} 27 {{/isEqualOr}}
@@ -3,21 +3,25 @@ @@ -3,21 +3,25 @@
3 {{#is-equal-or ../numOfOneRow '2'}} 3 {{#is-equal-or ../numOfOneRow '2'}}
4 <a href="{{href}}" class="pull-left shop-box"> 4 <a href="{{href}}" class="pull-left shop-box">
5 <div class="shop-img"> 5 <div class="shop-img">
  6 + {{#if ../lefTopImg}}
6 <img class="left-icon lazy" data-original="{{image2 ../lefTopImg q=85}}" alt=""> 7 <img class="left-icon lazy" data-original="{{image2 ../lefTopImg q=85}}" alt="">
7 - <img class="lazy" data-original="{{image2 shop_logo w=187 h=275 q=85}}" alt=""> 8 + {{/if}}
  9 + <img class="lazy" data-original="{{image2 shop_logo w=268 h=224 q=85}}" alt="">
8 </div> 10 </div>
9 - <div class="shop-bottom-bar" style="background-image: url({{image2 ../brandImg w=290 h=60 q=85}})"> 11 + <div class="shop-bottom-bar" style="background-image: url({{image2 ../brandImg w=268 h=60 q=85}})">
10 <span class="shop-name" style="{{#if ../shopNameFontColor}}color: {{../shopNameFontColor}}{{/if}}">{{shop_name}}</span> 12 <span class="shop-name" style="{{#if ../shopNameFontColor}}color: {{../shopNameFontColor}}{{/if}}">{{shop_name}}</span>
11 </div> 13 </div>
12 </a> 14 </a>
13 {{^}} 15 {{^}}
14 <a href="{{href}}" class="pull-left shop-box {{#is-equal-or ../displayStyle '0'}}shop-logo{{/is-equal-or}}"> 16 <a href="{{href}}" class="pull-left shop-box {{#is-equal-or ../displayStyle '0'}}shop-logo{{/is-equal-or}}">
15 <div class="shop-img"> 17 <div class="shop-img">
  18 + {{#if ../lefTopImg}}
16 <img class="left-icon lazy" data-original="{{image2 ../lefTopImg q=85}}" alt=""> 19 <img class="left-icon lazy" data-original="{{image2 ../lefTopImg q=85}}" alt="">
17 - <img class="lazy" data-original="{{image2 shop_logo w=156 h=106 q=85}}" {{#is-equal-or ../displayStyle '0'}}class="shop-logo-img lazy"{{/is-equal-or}} alt=""> 20 + {{/if}}
  21 + <img class="lazy" data-original="{{image2 shop_logo w=186 h=156 q=85}}" {{#is-equal-or ../displayStyle '0'}}class="shop-logo-img lazy"{{/is-equal-or}} alt="">
18 <span class="shop-name" style="{{#if ../shopNameFontColor}}color: {{../shopNameFontColor}}{{/if}}">{{shop_name}}</span> 22 <span class="shop-name" style="{{#if ../shopNameFontColor}}color: {{../shopNameFontColor}}{{/if}}">{{shop_name}}</span>
19 </div> 23 </div>
20 - <div class="shop-bottom-bar" style="background-image: url({{image2 ../brandImg w=290 h=60 q=85}});"> 24 + <div class="shop-bottom-bar" style="background-image: url({{image2 ../brandImg w=186 h=40 q=85}});">
21 </div> 25 </div>
22 </a> 26 </a>
23 {{/is-equal-or}} 27 {{/is-equal-or}}
@@ -6,6 +6,7 @@ @@ -6,6 +6,7 @@
6 @import "scss/feature/shop"; 6 @import "scss/feature/shop";
7 @import "scss/feature/bottom"; 7 @import "scss/feature/bottom";
8 @import "scss/feature/timed-cut"; 8 @import "scss/feature/timed-cut";
  9 +@import "scss/feature/redenvelope";
9 @import "scss/feature/liked-activity"; 10 @import "scss/feature/liked-activity";
10 11
11 /* stylelint-disable */ 12 /* stylelint-disable */
@@ -167,6 +167,69 @@ @@ -167,6 +167,69 @@
167 color: #000; 167 color: #000;
168 } 168 }
169 169
  170 + .sales-imgs-old {
  171 + position: absolute;
  172 + right: 0;
  173 + bottom: 28px;
  174 + width: 100%;
  175 + height: auto;
  176 + z-index: 1;
  177 + }
  178 +
  179 + .sales-imgs-new {
  180 + position: absolute;
  181 + right: 0;
  182 + bottom: 55px;
  183 + width: 100%;
  184 + height: auto;
  185 + z-index: 1;
  186 +
  187 + .advance {
  188 + display: none;
  189 + }
  190 + }
  191 +
  192 + .sales-product-pool {
  193 + .advance {
  194 + display: none;
  195 + }
  196 + }
  197 +
  198 + .leftdownimg {
  199 + width: auto;
  200 + max-width: 100%;
  201 + height: 26px;
  202 + margin-top: 10px;
  203 + }
  204 +
  205 + .advance {
  206 + width: auto;
  207 + height: 35px;
  208 + max-width: 100%;
  209 + background-size: contain;
  210 + background-repeat: no-repeat;
  211 + text-align: right;
  212 + display: inline-block;
  213 + position: relative;
  214 +
  215 + .img-seat {
  216 + visibility: hidden;
  217 + height: 35px;
  218 + display: inline-block;
  219 + width: auto;
  220 + }
  221 +
  222 + .advance-price {
  223 + position: absolute;
  224 + right: 10px;
  225 + top: 0;
  226 + line-height: 35px;
  227 + font-size: 27px;
  228 + font-weight: bold;
  229 + color: #fff;
  230 + }
  231 + }
  232 +
170 .vip-price-text { 233 .vip-price-text {
171 margin-right: 10px; 234 margin-right: 10px;
172 font-weight: 500; 235 font-weight: 500;
  1 +.redenvelope {
  2 + position: absolute;
  3 + top: 0;
  4 + left: 0;
  5 + width: 100%;
  6 + height: 100%;
  7 +}
1 $margin-top: 42px; 1 $margin-top: 42px;
2 -$margin-left-2: 20px;  
3 -$margin-left-3: 19.75px;  
4 -$floor-height-2: 432px;  
5 -$floor-height-3: 335px;  
6 -$shop-width-2: 285px;  
7 -$shop-width-3: 187px; 2 +$margin-left-2: 15px;
  3 +$padding-left-2: 45px;
  4 +$margin-left-3: 34px;
  5 +$floor-height-2: 281px;
  6 +$floor-height-3: 196px;
  7 +$shop-width-2: 268px;
  8 +$shop-width-3: 186px;
  9 +$margin-right-3: 7px;
8 10
9 .shop-container { 11 .shop-container {
10 width: 100%; 12 width: 100%;
@@ -54,19 +56,19 @@ $shop-width-3: 187px; @@ -54,19 +56,19 @@ $shop-width-3: 187px;
54 } 56 }
55 57
56 &.shop-two { 58 &.shop-two {
57 - padding-left: $margin-left-2; 59 + padding-left: $padding-left-2;
58 margin-top: $margin-top; 60 margin-top: $margin-top;
59 61
60 .shop-box { 62 .shop-box {
61 width: $shop-width-2; 63 width: $shop-width-2;
62 height: $floor-height-2; 64 height: $floor-height-2;
63 margin-right: $margin-left-2; 65 margin-right: $margin-left-2;
64 - margin-bottom: 40px; 66 + margin-bottom: 26px;
65 display: inline-block; 67 display: inline-block;
66 68
67 .shop-img { 69 .shop-img {
68 width: $shop-width-2; 70 width: $shop-width-2;
69 - height: 372px; 71 + height: 224px;
70 } 72 }
71 73
72 .shop-bottom-bar { 74 .shop-bottom-bar {
@@ -87,19 +89,19 @@ $shop-width-3: 187px; @@ -87,19 +89,19 @@ $shop-width-3: 187px;
87 .shop-box { 89 .shop-box {
88 width: $shop-width-3; 90 width: $shop-width-3;
89 height: $floor-height-3; 91 height: $floor-height-3;
90 - margin-right: $margin-left-3;  
91 - margin-bottom: 40px; 92 + margin-right: $margin-right-3;
  93 + margin-bottom: 16px;
92 display: inline-block; 94 display: inline-block;
93 95
94 .shop-img { 96 .shop-img {
95 width: $shop-width-3; 97 width: $shop-width-3;
96 - height: 275px; 98 + height: 156px;
97 } 99 }
98 100
99 .shop-bottom-bar { 101 .shop-bottom-bar {
100 - width: 187px;  
101 - height: 60px;  
102 - line-height: 60px; 102 + width: 186px;
  103 + height: 40px;
  104 + line-height: 40px;
103 color: #fff; 105 color: #fff;
104 background-size: 100% 100%; 106 background-size: 100% 100%;
105 background-repeat: no-repeat; 107 background-repeat: no-repeat;
@@ -137,7 +139,7 @@ $shop-width-3: 187px; @@ -137,7 +139,7 @@ $shop-width-3: 187px;
137 height: auto; 139 height: auto;
138 140
139 .shop-img { 141 .shop-img {
140 - height: 320px; 142 + height: 224px;
141 } 143 }
142 } 144 }
143 } 145 }
@@ -146,17 +148,17 @@ $shop-width-3: 187px; @@ -146,17 +148,17 @@ $shop-width-3: 187px;
146 padding-left: 32px; 148 padding-left: 32px;
147 149
148 .shop-box { 150 .shop-box {
149 - width: 184px; 151 + width: 186px;
150 height: auto; 152 height: auto;
151 - margin-right: 8px;  
152 - margin-bottom: 20px; 153 + margin-right: 7px;
  154 + margin-bottom: 16px;
153 155
154 .shop-bottom-bar { 156 .shop-bottom-bar {
155 height: 40px; 157 height: 40px;
156 } 158 }
157 159
158 .shop-img { 160 .shop-img {
159 - height: 210px; 161 + height: 156px;
160 } 162 }
161 } 163 }
162 164
@@ -176,9 +178,9 @@ $shop-width-3: 187px; @@ -176,9 +178,9 @@ $shop-width-3: 187px;
176 .shop-logo-img { 178 .shop-logo-img {
177 position: relative; 179 position: relative;
178 width: 132px; 180 width: 132px;
179 - height: 88px; 181 + height: 92px;
180 left: 26px; 182 left: 26px;
181 - top: 20px; 183 + top: 17px;
182 } 184 }
183 } 185 }
184 } 186 }