fe / yohobuywap-node · Commits

Go to a project

Authored by zhangxiaoru
Commit f76437f7f7ea83273a6e79162ef0b477ef3e1de0 1 parent 2f3dada0

推荐店铺优化

Inline Side-by-side
Showing 5 changed files with 157 additions and 54 deletions
... ... @@ -254,11 +254,13 @@ const getSearchData = (params) => {
!params.shop_id && !params.brand && !params.isApp) {
for (let i = 0; i < result.data.rec_shop_list.length; i++) {
if (parseInt(result.data.rec_shop_list[i].show_type, 10) === 1) {
result.data.rec_shop_list[i].is_shop = true;
newList.list.splice(parseInt(result.data.rec_shop_list[i].insert_index, 10), 0,
result.data.rec_shop_list[i]);
}
}
}
params.page = parseInt(params.page, 10);
result.data.total = parseInt(result.data && result.data.total || 0, 10);
... ...
... ... @@ -2,19 +2,21 @@
{{#if is_shop}}
<div class="good-info brand-info" data-type="hot-shop" data-brand="" data-shop="">
<div class="brand-info-box">
<img src="{{image shop_logo 240 85}}" alt="LALABOBO">
<h5 class="bname">{{shop_name}}</h5>
<img src="{{image shop_logo 240 85}}" alt="{{shop_name}}">
{{!-- <h5 class="bname">{{shop_name}}</h5> --}}
<p class="summary">
<span class="summary-info">
<b>{{new_product_num}}</b>
<b>上新</b>
</span>
<span class="summary-info">
<b>{{favorite_num}}</b>
<b>收藏</b>
</span>
上新<b>{{new_product_num}}</b>件&nbsp;
&nbsp;<b>{{favorite_num}}</b>人收藏
</p>
<a href="//m.yohobuy.com/product/index/brand?domain={{shop_domain}}" class="entry">进入店铺<span></span></a>
<div class="shop-goods">
{{#product_list}}
<div class="info">
<img class="lazy" src="{{image default_images 110 145}}"></img>
</div>
{{/product_list}}
</div>
</div>
</div>
{{else}}
... ...
... ... @@ -2,8 +2,16 @@
<div class="good-info brand-info" data-type="hot-shop" data-brand="{{brand_id}}" data-shop="{{shop_id}}">
<div class="brand-info-box">
<img src="{{image shop_logo 240 100}}" alt="{{shop_name}}">
<h5 class="bname">{{shop_name}}</h5>
<p class="summary">上新<span class="red">{{new_product_num}}</span>件&nbsp;&nbsp;<span class="red">{{favorite_num}}</span>人收藏</p>
{{!-- <h5 class="bname">{{shop_name}}</h5> --}}
<p class="summary">上新<b>{{new_product_num}}</b>件&nbsp;&nbsp;<b>{{favorite_num}}</b>人收藏</p>
<a href="//m.yohobuy.com/product/index/brand?domain={{shop_domain}}" class="entry">进入店铺</a>
<div class="shop-goods">
{{#product_list}}
<div class="info">
<img class="lazy" src="{{image default_images 110 145}}"></img>
</div>
{{/product_list}}
</div>
</div>
</div>
... ...
.brand-info {
padding-top: 28px;
padding-bottom: 55px;
text-align: center;
.brand-info-box {
background-color: #f5f5f5;
padding-top: 22px;
height: 368px;
padding-top: 40px;
height: 478px;
overflow: hidden;
border: 2px solid #e0e0e0;
}
img {
width: 141px;
height: 66px;
height: 80px;
}
.bname {
font-size: 18px;
color: #b0b0b0;
font-size: 24px;
color: #444;
margin-top: 40px;
margin-bottom: 60px;
margin-bottom: 58px;
}
.summary {
font-size: 16px;
margin-bottom: 36px;
font-size: 23px;
color: #b0b0b0;
margin-top: 25px;
.red {
color: #e27b88;
b {
color: #d60018;
}
}
.entry {
display: flex;
align-items: center;
justify-content: center;
height: 45px;
font-size: 24px;
line-height: 60px;
color: #fff;
background-color: #d0021b;
width: 170px;
margin: 35px 53px;
span {
background-image: resolve("product/shop-entry.png");
display: inline-block;
height: 50px;
padding-left: 19px;
padding-right: 19px;
line-height: 50px;
color: #444;
border: 2px solid #444;
border-radius: 5px;
width: 14px;
height: 20px;
background-size: 100%;
margin-left: 10px;
}
}
.shop-goods {
border-top: 1px solid #e0e0e0;
position: relative;
padding: 18px 16px;
&:before {
content: "";
position: absolute;
top: -25px;
left: 47%;
width: 0;
height: 0;
border-right: 10px solid transparent;
border-bottom: 13px solid #e0e0e0;
border-top: 10px solid transparent;
border-left: 10px solid transparent;
}
&:after {
content: "";
position: absolute;
top: -22px;
left: 47%;
width: 0;
height: 0;
border-right: 10px solid transparent;
border-bottom: 13px solid #fff;
border-top: 10px solid transparent;
border-left: 10px solid transparent;
}
.info {
width: 110px;
height: 145px;
float: left;
}
img {
width: 100%;
height: 100%;
}
.info:first-child {
margin-right: 20px;
}
}
}
... ...
... ... @@ -402,15 +402,14 @@
text-align: center;
.brand-info-box {
padding-top: 72px;
padding-top: 40px;
height: 478px;
overflow: hidden;
border: 2px solid #e0e0e0;
}
img {
width: 240px;
height: 100px;
height: 80px;
}
.bname {
... ... @@ -421,23 +420,12 @@
}
.summary {
font-size: 30px;
color: #444;
}
.summary-info {
width: 48%;
display: inline-block;
text-align: center;
font-size: 23px;
color: #b0b0b0;
margin-top: 25px;
b {
display: block;
width: 100%;
}
b:nth-child(2) {
color: #b0b0b0;
font-size: 22px;
color: #d60018;
}
}
... ... @@ -445,14 +433,13 @@
display: flex;
align-items: center;
justify-content: center;
height: 60px;
height: 45px;
font-size: 24px;
margin: 0 20px;
line-height: 60px;
color: #fff;
background-color: #d0021b;
width: 85%;
margin-top: 18px;
width: 170px;
margin: 35px 53px;
span {
background-image: resolve("product/shop-entry.png");
... ... @@ -463,6 +450,53 @@
margin-left: 10px;
}
}
.shop-goods {
border-top: 1px solid #e0e0e0;
position: relative;
padding: 18px 16px;
&:before {
content: "";
position: absolute;
top: -25px;
left: 47%;
width: 0;
height: 0;
border-right: 10px solid transparent;
border-bottom: 13px solid #e0e0e0;
border-top: 10px solid transparent;
border-left: 10px solid transparent;
}
&:after {
content: "";
position: absolute;
top: -22px;
left: 47%;
width: 0;
height: 0;
border-right: 10px solid transparent;
border-bottom: 13px solid #fff;
border-top: 10px solid transparent;
border-left: 10px solid transparent;
}
.info {
width: 110px;
height: 145px;
float: left;
}
img {
width: 100%;
height: 100%;
}
.info:first-child {
margin-right: 20px;
}
}
}
}
... ...