Loki
/
zsw-farm-bxg
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

热门榜单接口对接

sxx
whyneedname 2 years ago
parent
d79e465b81
commit
5c0b14a348
3 changed files with 168 additions and 60 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 11
      api/store.js
  2. 213
      pages/shop/HotNewGoods/index.vue
  3. 4
      pages/user/User/index.vue

11
api/store.js
Unescape View File

@ -273,7 +273,16 @@ export function getEntry(data) {
* 热门榜单
*/
export function getHotList(data) {
return request.get("/hotList/"+ data, {}, {
return request.get("/hotList", data, {
login: false
});
}
/**
* 热门榜单信息
*/
export function getHotListData() {
return request.get("/hotListData", {}, {
login: false
});
}

213
pages/shop/HotNewGoods/index.vue
Unescape View File

@ -16,7 +16,7 @@
<view class="banner-box">
<swiper class="swiper" circular @change="swiperChange" :autoplay="true">
<swiper-item v-for="(item, index) in banner" :key="index" class="swiper-item" @click="goBannerDetail">
<image class="swiper-image " :src="item" mode="aspectFill" lazy-load>
<image class="swiper-image " :src="item.pic" mode="aspectFill" lazy-load>
</image>
</swiper-item>
</swiper>
@ -26,22 +26,35 @@
</view>
<view class="content-box">
<scroll-view scroll-x="true">
<scroll-view class="classify-scroll" scroll-x="true">
<view class="classify-box">
<view v-for="(item,index) in 4" :key="index" @click="changeClassify(index)">
<image :class="'classify-item ' + (classifyType == index?'on':'')" :src="item.listImage" mode=""></image>
<!-- <view v-for="(item,index) in 4" :key="index" @click="changeClassify(index)"> -->
<view v-for="(item,index) in classifyList" :key="index" @click="changeClassify(index)">
<view :class="'classify-item acea-row row-middle ' + (classifyType == index?'on':'')">
<image :src="item.listImage" mode="aspectFill"></image>
</view>
</view>
</view>
</scroll-view>
<view class="nav-box acea-row">
<view class="item on">全部</view>
<view class="item acea-row row-middle">
<view class="">2022年10月</view>
<view class="jiantou-down"></view>
<scroll-view class="nav-scroll" scroll-x="true">
<view class="nav-box">
<view class="item on">全部</view>
<picker class="item" @change="bindPickerChange" :value="mouthIndex" :range="mouthList" v-if="mouthList.length">
<view class="nav-name">{{form.mouth}}</view>
<view class="jiantou-down"></view>
</picker>
<view class="item">
<view class="nav-name">价格</view>
<view class="jiantou-down"></view>
</view>
<picker class="item" @change="bindPickerSubclassChange" :value="subclassIndex" :range="subclassList" range-key="cateName" v-if="subclassList.length">
<view class="nav-name">{{subclass.cateName}}</view>
<view class="jiantou-down"></view>
</picker>
<view><view class="nav-name" style="margin-right: 12rpx;"></view></view>
</view>
</view>
</scroll-view>
<view class="notice-box acea-row row-middle">
<image src="@/static/images/laba.png" mode="aspectFill"></image>
@ -53,8 +66,7 @@
<view class="list-box">
<view class="top-box">
<view class="top-item acea-row" v-for="(item,index) in goodsList" :key="index" @tap="goGoodsCon(item)">
<!-- <view class="top-item acea-row" v-for="(item,index) in topList" :key="index" @tap="goGoodsCon(item)"> -->
<view class="top-item acea-row" v-for="(item,index) in topList" :key="index" @tap="goGoodsCon(item)">
<view class="top-num-box">
<view class="">{{index+1}}</view>
<view class="tip">{{index===0?'ST':index===1?'ND':index===2?'RD':'TH'}}</view>
@ -69,8 +81,7 @@
</view>
</view>
<view class="goods-list acea-row row-between" v-if="goodsList.length">
<view class="goods-item" v-for="(item, promotionGoodIndex) in goodsList"
:key="promotionGoodIndex" @tap="goGoodsCon(item)">
<view class="goods-item" v-for="(item, promotionGoodIndex) in goodsList" :key="promotionGoodIndex" @tap="goGoodsCon(item)">
<view class="img-box">
<image class="img" :src="item.image" lazy-load mode="aspectFill"></image>
</view>
@ -99,7 +110,7 @@
<script>
// import UniNoticeBar from '@/components/uni-notice-bar/uni-notice-bar'
import GoodList from "@/components/GoodList";
import { getBanner, getHotList, getGroomList } from "@/api/store";
import { getBanner, getHotListData, getHotList, getGroomList } from "@/api/store";
export default {
name: "HotNewGoods",
components: {
@ -111,33 +122,49 @@ export default {
return {
banner: [],
classifyType: 0,
classifyList: [],
mouthList: [],
mouthIndex: 0,
// mouth: '',
subclassList: [],
subclassIndex: 0,
subclass: {},
form: {
mouth: '', // 所属月份
hotListId: null, // 榜单ID
cateId: null, // 商品分类ID
page: 1,
limit: 20,
priceOrder: '', // desc降序/asc升序
salesOrder: '',
},
topList: [],
goodsList: [],
name: "",
icon: "",
RecommendSwiper: {
pagination: {
el: ".swiper-pagination",
clickable: true
},
autoplay: {
disableOnInteraction: false,
delay: 2000
},
loop: true,
speed: 1000,
observer: true,
observeParents: true
}
// name: "",
// icon: "",
// RecommendSwiper: {
// pagination: {
// el: ".swiper-pagination",
// clickable: true
// },
// autoplay: {
// disableOnInteraction: false,
// delay: 2000
// },
// loop: true,
// speed: 1000,
// observer: true,
// observeParents: true
// }
};
},
mounted: function() {
this.titleInfo();
this.getIndexGroomList();
getBanner(3).then(res => {
// this.titleInfo();
// this.getIndexGroomList();
getBanner(4).then(res => {
this.$set(this,'banner',res.data.banner)
})
this.getHotList();
this.getHotListData();
},
methods: {
goBannerDetail(item){
@ -148,15 +175,61 @@ export default {
swiperChange(e) {
this.swiperCurrent = e.detail.current;
},
getHotList() {
let mouth = '2022-9'
getHotList(mouth),then(res => {
getHotListData() {
getHotListData().then(res => {
this.hotListData = res.data;
this.mouthList = res.data.mouthList;
this.form.mouth = this.mouthList[0];
this.classifyList = this.hotListData[this.form.mouth].hotListDTOS;
this.subclassList = this.hotListData[this.form.mouth].cateDtos;
this.form.hotListId = this.classifyList[this.classifyType].id;
this.subclass = this.subclassList[0];
this.form.cateId = this.subclass.cateId;
this.getHotList();
})
},
bindPickerChange(e) {
this.mouthIndex = e.detail.value;
this.form.mouth = this.mouthList[this.mouthIndex];
this.classifyList = this.hotListData[this.form.mouth].hotListDTOS;
this.subclassList = this.hotListData[this.form.mouth].cateDtos;
this.form.hotListId = this.classifyList[this.classifyType].id;
this.subclass = this.subclassList[0];
this.form.cateId = this.subclass.cateId;
this.goodsList = [];
this.getHotList();
},
changeClassify(i) {
if(this.classifyType == i) return
this.classifyType = i;
this.form.hotListId = this.classifyList[this.classifyType].id;
this.goodsList = [];
this.getHotList();
},
bindPickerSubclassChange(e) {
this.subclassIndex = e.detail.value;
this.subclass = this.subclassList[this.subclassIndex];
this.form.cateId = this.subclass.cateId;
this.goodsList = [];
this.getHotList();
},
getHotList() {
getHotList(this.form).then(res => {
this.goodsList = this.sortData(res.data, 5);
})
},
// 数据分层
sortData(oArr, length) {
let arr = [];
let minArr = [];
if (oArr.length > length) {
this.topList = oArr.slice(0, length);
arr = oArr.slice(length, oArr.length);
} else {
this.topList = oArr;
}
return arr;
},
goGoodsCon(item) {
if(item.isIntegral === 1) {
@ -176,7 +249,7 @@ export default {
}
},
titleInfo: function() {
/* titleInfo: function() {
let type = this.$yroute.query.type;
if (type === "1") {
this.name = "精品推荐";
@ -207,7 +280,7 @@ export default {
duration: 2000
});
});
}
} */
}
};
</script>
@ -280,7 +353,7 @@ export default {
background: #FFFFFF;
box-shadow: 0rpx -4rpx 38rpx 0rpx rgba(0,0,0,0.1);
border-radius: 28rpx 28rpx 0rpx 0rpx;
scroll-view {
.classify-scroll {
position: relative;
top: -60rpx;
margin-bottom: -60rpx;
@ -296,22 +369,41 @@ export default {
.classify-item {
width: 176rpx;
height: 96rpx;
text-align: center;
margin-right: 20rpx;
border-radius: 16rpx;
background: linear-gradient(135deg, #39D396 0%, #2DB7AD 43%, #1B8DCC 100%);
image {
width: 176rpx;
height: 96rpx;
border-radius: 16rpx;
transition: all .3s linear;
// background: linear-gradient(135deg, #39D396 0%, #2DB7AD 43%, #1B8DCC 100%);
}
transition: width .3s linear;
}
.classify-item.on {
width: 220rpx;
height: 120upx;
height: 120rpx;
transition: width .3s linear;
image {
width: 220rpx;
height: 120rpx;
transition: all .3s linear;
}
}
}
}
}
.content-box .nav-scroll {
overflow:hidden;
white-space:nowrap;
}
.content-box .nav-box {
display: flex;
flex-wrap: nowrap;
padding: 20rpx 32rpx;
margin-right: 32rpx;
.item {
// width: 87px;
height: 40rpx;
border-radius: 16rpx;
border: 2rpx solid #2EB5AE;
@ -322,6 +414,12 @@ export default {
color: #2DB5AE;
line-height: 36rpx;
margin-right: 20rpx;
.nav-name,.jiantou-down {
display: inline-block;
}
.jiantou-down {
margin-bottom: 4rpx;
}
}
.item.on {
width: 124rpx;
@ -331,6 +429,16 @@ export default {
}
}
.jiantou-down {
width: 0;
height: 0;
border-top: 10rpx solid #2EB5AE;
border-bottom: 0rpx;
border-left: 6rpx solid transparent;
border-right: 6rpx solid transparent;
margin-left: 2rpx;
}
.notice-box {
margin: 0rpx 32rpx 18rpx;
padding: 0rpx 16rpx;
@ -352,7 +460,7 @@ export default {
}
.list-box {
height: calc(100% - 196rpx);
height: calc(100% - 200rpx);
overflow-y: scroll;
.top-box {
padding: 0rpx 32rpx 12rpx;
@ -490,13 +598,4 @@ export default {
}
}
.jiantou-down {
width: 0;
height: 0;
border-top: 10rpx solid #2EB5AE;
border-bottom: 0rpx;
border-left: 6rpx solid transparent;
border-right: 6rpx solid transparent;
margin-left: 2rpx;
}
</style>

4
pages/user/User/index.vue
Unescape View File

@ -71,7 +71,7 @@
<view class="user-info acea-row row-between">
<view class="coupon-box acea-row row-between-wrapper" @click="goUserCoupon">
<view class="title">我的券包</view>
<view class="acea-row row-right">
<view class="acea-row row-right" v-if="userInfo.couponCount !== undefined">
<view v-if="String(userInfo.couponCount).length == 1" class="item acea-row row-column-between">
<view class="top"></view>
<view class="bottom"></view>
@ -86,7 +86,7 @@
</view>
<view class="coupon-box integral-box acea-row row-between-wrapper" @click="goIntegral()">
<view class="title">我的积分</view>
<view class="acea-row row-right">
<view class="acea-row row-right" v-if="userInfo.integral !== undefined">
<view v-if="5-String(userInfo.integral).length > 0" class="item acea-row row-column-between" v-for="(item,index) in 5-String(userInfo.integral).length" :key="index">
<view class="top"></view>
<view class="bottom"></view>

Write Preview
Loading…
Cancel
Save