clunt
/
dingdong-mall
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

首页热门商品展示接口对接

This commit is contained in:
donqi 2022-06-07 11:23:36 +08:00
parent fb68cd3c90
commit 0c9f95ce18
4 changed files with 50 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
common/js/request.js
View File

@ -372,5 +372,17 @@ export default {
}
})
return res[1].data;
}
},
async getHotGoods(params = {}) {
let res = await uni.request({
url: '/goods/goods/hot/list',
method: 'POST',
data: params,
header: {
pageNum: params.pageNum,
pageSize: params.pageSize
}
})
return res[1].data;
},
}

15
components/goods-card/horizontal-goods-card.vue
View File

@ -5,17 +5,26 @@
<view class="margin-left-sm product-content">
<view>
<view class="text-black">{{product.goodsName}}</view>
<view class="text-sm" v-if="ifShowComments">{{product.comments}}</view>
<view class="text-sm" v-if="ifShowComments">{{product.remark}}</view>
</view>
<view class="flex justify-between align-center">
<view v-if="product.discountPrice" class="flex justify-start align-center">
<text class="text-price text-red text-bold text-xl">{{product.discountPrice}}</text>
<text class="text-del" v-if="product.goodsPrice">¥{{product.goodsPrice}}</text>
</view>
<view v-else class="flex justify-start align-center">
<view v-else-if="product.goodsPrice" class="flex justify-start align-center">
<text class="text-price text-red text-bold text-xl">{{product.goodsPrice}}</text>
</view>
<view class="padding-xs">
<view v-else-if="product.goodsStandardList && product.goodsStandardList.length > 0">
<view v-if="product.goodsStandardList[0].discountPrice" class="flex justify-start align-center">
<text class="text-price text-red text-bold text-xl">{{product.goodsStandardList[0].discountPrice}}</text>
<text class="text-del" v-if="product.goodsPrice">¥{{product.goodsStandardList[0].goodsPrice}}</text>
</view>
<view v-else-if="product.goodsStandardList[0].goodsPrice" class="flex justify-start align-center">
<text class="text-price text-red text-bold text-xl">{{product.goodsStandardList[0].goodsPrice}}</text>
</view>
</view>
<view class="padding-xs" v-if="product.type">
<view class='cu-tag light bg-blue'>{{product.type}}</view>
</view>
</view>

11
components/goods-card/vertical-goods-card.vue
View File

@ -8,16 +8,15 @@
<view class="cu-card case no-card solid-bottom" v-for="(item, index) in goodsInfos" :key="index" @click="showDetails(item)">
<view class="cu-item shadow">
<view class="image">
<image :src="item.imgUrl"
mode="widthFix"></image>
<image :src="item.goodsImgUrl" mode="aspectFill"></image>
</view>
<view class="cu-item item-margin-custom">
<view class="content flex-sub">
<view class="text-xl">{{item.name}}</view>
<view class="text-sm text-gray margin-tb-xs">{{item.desc}}</view>
<view class="text-xl">{{item.goodsName}}</view>
<view class="text-sm text-gray margin-tb-xs">{{item.remark}}</view>
<view class="flex justify-between align-end">
<view class="text-red text-xs">{{item.tag}}</view>
<view class="text-red text-price text-xl">{{item.price}}</view>
<view class="text-red text-price text-xl">{{item.goodsStandardList[0].goodsPrice}}</view>
</view>
</view>
</view>
@ -49,6 +48,6 @@
<style scoped>
.item-margin-custom {
margin: 10rpx 30rpx;
margin: 20rpx 30rpx;
}
</style>

30
pages/index/home.vue
View File

@ -4,7 +4,7 @@
<swiper class="screen-swiper" :class="dotStyle?'square-dot':'round-dot'" :indicator-dots="true" :circular="true"
:autoplay="true" interval="5000" duration="500">
<swiper-item v-for="(item,index) in swiperList" :key="item.id">
<image :src="item.url" mode="aspectFill" v-if="item.type=='image'"></image>
<image :src="item.url" v-if="item.type=='image'"></image>
<video :src="item.url" autoplay loop muted :show-play-btn="false" :controls="false" objectFit="cover"
v-if="item.type=='video'"></video>
</swiper-item>
@ -69,10 +69,10 @@
</view>
</view>
<!-- 超值服务 -->
<vertical-goods-card ref="discountGoodsCard" :goodsInfos="discountGoods.goodsInfos"
:title="discountGoods.title"></vertical-goods-card>
<!-- <vertical-goods-card ref="discountGoodsCard" :goodsInfos="discountGoods.goodsInfos"
:title="discountGoods.title"></vertical-goods-card> -->
<!-- 热门服务 -->
<vertical-goods-card ref="hotGoodsCard" :goodsInfos="hotGoods.goodsInfos" :title="hotGoods.title">
<vertical-goods-card :goodsInfos="hotGoods" title="大家都在买">
</vertical-goods-card>
</view>
<!-- 强制要求用户授权登录的弹窗 -->
@ -118,7 +118,7 @@
tabCur: 0,
categories: [],
subCategories: [],
hotGoods: {},
hotGoods: [],
discountGoods: {},
InputBottom: 0,
isAuthWxLoginModal: false,
@ -151,14 +151,21 @@
if (this.isAuthWxPhoneModal) {
return;
}
// 加载区域信息
this.loadRegionList();
// 加载热门商品
let hotGoodsRes = await this.$request.getHotGoods({
pageNum: 0,
pageSize: 50
});
this.hotGoods = hotGoodsRes.rows;
this.loadRegionList();
this.swiperList = await this.$api.data('swiperList');
this.categories = await this.$api.data('categories');
this.subCategories = await this.$api.data('subCategories');
this.moduleBarInfos = await this.$api.data('moduleBarInfos');
this.hotGoods = await this.$api.data('hotGoods');
this.discountGoods = await this.$api.data('discountGoods');
// this.hotGoods = await this.$api.data('hotGoods');
// this.discountGoods = await this.$api.data('discountGoods');
},
bindEvent() {
uni.$on('index_showProductDetail', this.showDetails);
@ -239,8 +246,11 @@
console.log("商品搜索中...");
},
showDetails(productItem) {
uni.navigateTo({
url: '../product/product-detail'
let params = {
goodsId: productItem.goodsId
}
uni.navigateTo({
url: '/pages/product/product-detail?params=' + encodeURIComponent(JSON.stringify(params))
});
},
showProductCategories() {