Merge pull request '产品列表, 按上架时间和点赞量排序' (#43) from DJ into dev

Reviewed-on: http://git.hchyun.com/feashow/pupil/pulls/43
This commit is contained in:
odjbin
2023-01-06 12:04:28 +00:00
3 changed files with 61 additions and 17 deletions

View File

@@ -43,9 +43,17 @@
productList: [],
pageNum: 1, // 当前页
pageSize: 4, // 每页条数
sortType: ''
}
},
created() {
uni.$on("getCurrent", data => {
if (data == 0) {
this.sortType = 1
} else if (data == 1) {
this.sortType = 2
}
})
this.getProducts()
this.imgUrl = uni.getStorageSync('img_url')
},
@@ -53,21 +61,21 @@
//获取产品列表
getProducts() {
this.$apiServe.getProducts({
sortType: this.sortType,
pageSize: this.pageSize,
pageNum: this.pageNum
}).then(res => {
let tags = res.data.data
for (const item of tags) {
let tag = item.tags
this.tagsArray = tag.split(',')
item.tags = this.tagsArray[0]
}
this.$emit("getChild", tags.length);
// 为数据赋值:通过展开运算符的形式,进行新旧数据的拼接
this.productList = [...this.productList, ...res.data.data]
// this.$emit("getChild", tags.length);
// 用于触底刷新 为数据赋值:通过展开运算符的形式,进行新旧数据的拼接
// this.productList = [...this.productList, ...res.data.data]
//这用于上架时间和点赞量的数据切换
this.productList = res.data.data
}).finally(_ => {
})

View File

@@ -33,14 +33,14 @@
</view> -->
<!-- 选项卡: 上架时间和点赞量 -->
<view>
<u-tabs :list="tabList" lineColor="#15CA65" :is-scroll="false"
activeStyle="color:#15CA65;font-weight: bold;">
<u-tabs :list="tabList" lineColor="#15CA65" scrollable="false"
activeStyle="color:#15CA65;font-weight: bold;" :current="tabCurrent" @change="tabChange">
</u-tabs>
</view>
<!-- 产品 -->
<products ref="getProducts" @getChild="getChild()"></products>
<products ref="getProductsByTime"></products>
<view style="font-size: 24rpx;color: #A3A3A3;text-align: center;padding: 26rpx 0;"
v-if="reachBottomLength==0">
v-show="reachBottomLength===0">
没有更多数据了</view>
</view>
</view>
@@ -49,10 +49,12 @@
import {
serverHost
} from '@/service/request.js'
import loginVue from '../my/login/login.vue'
export default {
data() {
return {
classifyList: [],
tabCurrent: 0,
tabList: [{
name: '上架时间'
},
@@ -62,13 +64,16 @@
],
imgUrl: '',
swiperList: [],
reachBottomLength: ''
reachBottomLength: '',
productList: [],
pageNum: 1,
sortType: ''
}
},
onReachBottom() {
this.$refs.getProducts.pageNum += 1
this.pageNum += 1
if (this.reachBottomLength !== 0) {
this.$refs.getProducts.getProducts()
this.getNewProducts()
}
},
onLoad() {
@@ -79,6 +84,37 @@
this.imgUrl = uni.getStorageSync('img_url')
},
methods: {
//点击上架时间和点赞量切换页面
tabChange(data) {
this.tabCurrent = data.index
uni.$emit("getCurrent", data.index);
if (data.index == 0) {
this.sortType = 1
} else if (data.index == 1) {
this.$refs.getProductsByTime.getProducts()
this.sortType = 2
}
},
//下拉刷新获取新数据
getNewProducts() {
this.$apiServe.getProducts({
sortType: this.sortType,
pageSize: 4,
pageNum: this.pageNum
}).then(res => {
let tags = res.data.data
for (const item of tags) {
let tag = item.tags
this.tagsArray = tag.split(',')
item.tags = this.tagsArray[0]
}
if (tags.length === 0) {
this.reachBottomLength = tags.length
}
this.$refs.getProductsByTime.productList.push(...res.data.data)
})
},
//获取token
getToken() {
var that = this
uni.login({
@@ -111,9 +147,9 @@
// console.log("手机code : ", code);
},
//获取子组件的getProducts方法返回数据的length用于当length为0时取消发送请求
getChild(e) {
this.reachBottomLength = e
},
// getChild(e) {
// this.reachBottomLength = e
// },
//获取一级分类
getCategories() {
this.$apiServe.getCategories().then(res => {

View File

@@ -182,7 +182,7 @@ const apiService = {
},
// 获取产品列表
getProducts(data) {
const url = `/home/product?sortType=1`
const url = `/home/product`
return new Promise((resolve, reject) => {
resolve(service.get(url, data))
})