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

View File

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

View File

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