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