mkm/nk-shop2.0
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

搜索店铺商品滑动

Browse Source
This commit is contained in:
THK3121 2023-06-08 18:13:59 +08:00
parent d19c2a1834
commit 6d3046e647
1 changed files with 76 additions and 37 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

113
pages/columnGoods/goods_search_con/index.vue
View File

@ -159,7 +159,7 @@
</view>
<view class="link" @click="goStore(item.mer_id)">进店</view>
</view>
<view class="pic-wrapper">
<!-- <view class="pic-wrapper">
<view class="pic-item" v-for="(goods,index) in item.recommend" :key="index">
<navigator :url="`/pages/goods_details/index?id=${goods.product_id}`">
<image :src="goods.image" mode=""></image>
@ -168,7 +168,20 @@
</view>
</navigator>
</view>
</view>
</view> -->
<scroll-view scroll-x="true" class="pro-box" :class="'styleType'+store_street_theme">
<navigator :url="`/pages/goods_details/index?id=${itemn.product_id}`"
hover-class="none" class="pro-item" v-for="(itemn,indexn) in item.recommend" :key='indexn'>
<view class="picture">
<easy-loadimage mode="widthFix" :image-src="itemn.image"></easy-loadimage>
<view v-if="itemn.border_pic" :style="{ backgroundImage: `url(${itemn.border_pic})` }"
class="border-picture"></view>
</view>
<view class="price">
<text>￥</text>{{itemn.price}}
</view>
</navigator>
</scroll-view>
</view>
<view class='loadingicon acea-row row-center-wrapper' v-if='loading'>
<text class='loading iconfont icon-jiazai' :hidden='loading==false'></text>{{loadTitle}}
@ -529,7 +542,8 @@
limit: this.sotreParam.limit,
order: this.sotreParam.order,
category_id: this.sotreParam.category_id,
type_id: this.sotreParam.type_id
type_id: 10
}
if (this.latitude) {
serachData.location = this.latitude + ',' + this.longitude
@ -1393,40 +1407,65 @@
font-size: 24rpx;
}
}
.pic-wrapper {
display: flex;
margin-top: 30rpx;
.pic-item {
position: relative;
width: 226rpx;
height: 226rpx;
margin-right: 16rpx;
image {
width: 226rpx;
height: 226rpx;
border-radius: 16rpx;
}
.price {
position: absolute;
right: 0;
bottom: 0;
height: 36rpx;
padding: 0 10rpx;
line-height: 36rpx;
text-align: center;
background: rgba(0, 0, 0, .5);
border-radius: 16rpx 2rpx 16rpx 2rpx;
color: #fff;
font-size: 24rpx;
text {
font-size: 18rpx;
}
}
&:nth-child(3n) {
margin-right: 0;
}
}
}
.pro-box {
white-space: nowrap;
display: flex;
align-items: center;
padding: 20rpx 20rpx 30rpx;
.pro-item {
display: inline-block;
width: 218rpx;
margin-right: 14rpx;
.picture,
/deep/image,
uni-image {
width: 100%;
height: 214rpx;
border-radius: 8rpx;
position: relative;
}
.price {
margin-top: 5rpx;
font-size: 28rpx;
color: var(--view-priceColor);
font-weight: bold;
text {
font-size: 28rpx;
}
}
&:last-child {
margin-right: 0;
}
}
&.styleType3 {
padding: 20rpx;
.pro-item {
display: inline-block;
background-color: #fff;
border-radius: 16rpx;
text-align: center;
padding: 10rpx 0 20rpx;
.picture,
/deep/image,
uni-image {
width: 194rpx;
height: 194rpx;
text-align: center;
border-radius: 8rpx;
position: relative;
margin: 0 auto;
}
}
}
}
}
}
</style>