feat: 优化我的关注页面 1. 添加接口测试代码 2. 优化数据加载逻辑 3. 添加加载状态控制
This commit is contained in:
davy
parent
5bda409025
commit
59eaa69e5c
@ -348,6 +348,8 @@ export default {
|
||||
.page {
|
||||
min-height: 100vh;
|
||||
background: #F9F9F9;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
// 筛选导航
|
||||
.filter-nav {
|
||||
@ -529,7 +531,7 @@ export default {
|
||||
margin-top: 24rpx;
|
||||
|
||||
.beer-list {
|
||||
height: calc(100vh - 300rpx);
|
||||
height: calc(100vh - 200rpx);
|
||||
|
||||
.beer-card {
|
||||
margin-bottom: 24rpx;
|
||||
@ -543,7 +545,7 @@ export default {
|
||||
}
|
||||
|
||||
.empty-state {
|
||||
padding: 160rpx 0;
|
||||
padding: 120rpx 0;
|
||||
text-align: center;
|
||||
|
||||
.empty-text {
|
||||
@ -555,17 +557,19 @@ export default {
|
||||
}
|
||||
|
||||
.loading-status {
|
||||
padding: 24rpx 0;
|
||||
padding: 8rpx 0;
|
||||
text-align: center;
|
||||
|
||||
.loading-wrapper {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
height: 32rpx;
|
||||
|
||||
.loading-text {
|
||||
font-size: 24rpx;
|
||||
color: #999;
|
||||
line-height: 1;
|
||||
&::after {
|
||||
content: '';
|
||||
display: inline-block;
|
||||
@ -583,6 +587,8 @@ export default {
|
||||
font-size: 24rpx;
|
||||
color: #999;
|
||||
opacity: 0.8;
|
||||
height: 32rpx;
|
||||
line-height: 32rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -115,13 +115,61 @@
|
||||
pageSize: 10
|
||||
},
|
||||
totalBeer: 0,
|
||||
totalBrewery: 0
|
||||
totalBrewery: 0,
|
||||
loading: false,
|
||||
refreshing: false
|
||||
};
|
||||
},
|
||||
onShow() {
|
||||
this.checkLoginStatus()
|
||||
},
|
||||
onLoad() {
|
||||
// 测试接口
|
||||
console.log('开始测试接口...')
|
||||
|
||||
// 测试获取酒款收藏列表
|
||||
listMyFavoriteBeer({
|
||||
pageNum: 1,
|
||||
pageSize: 10
|
||||
}).then(res => {
|
||||
console.log('酒款收藏列表测试成功:', res)
|
||||
}).catch(err => {
|
||||
console.error('获取酒款收藏列表失败:', err)
|
||||
})
|
||||
|
||||
// 测试获取品牌收藏列表
|
||||
listMyFavoriteBrewery({
|
||||
pageNum: 1,
|
||||
pageSize: 10
|
||||
}).then(res => {
|
||||
console.log('品牌收藏列表测试成功:', res)
|
||||
}).catch(err => {
|
||||
console.error('获取品牌收藏列表失败:', err)
|
||||
})
|
||||
|
||||
// 测试取消收藏接口(需要有效的ID)
|
||||
// favorBeer({
|
||||
// beerId: 'xxx', // 需要替换为实际的beerId
|
||||
// status: 2
|
||||
// }).then(res => {
|
||||
// console.log('取消酒款收藏测试成功:', res)
|
||||
// }).catch(err => {
|
||||
// console.error('取消酒款收藏失败:', err)
|
||||
// })
|
||||
|
||||
// favorBrewery({
|
||||
// breweryId: 'xxx', // 需要替换为实际的breweryId
|
||||
// status: 2
|
||||
// }).then(res => {
|
||||
// console.log('取消品牌收藏测试成功:', res)
|
||||
// }).catch(err => {
|
||||
// console.error('取消品牌收藏失败:', err)
|
||||
// })
|
||||
|
||||
// 原有的数据加载
|
||||
this.getFavoriteBeerList()
|
||||
this.getFavoriteBreweryList()
|
||||
|
||||
// 监听需要登录的事件
|
||||
uni.$on('needLogin', () => {
|
||||
this.toLogin()
|
||||
@ -197,21 +245,12 @@
|
||||
this.checkLoginStatus()
|
||||
},
|
||||
tabSelect(e) {
|
||||
console.log(e)
|
||||
this.tabCur = e.currentTarget.dataset.id;
|
||||
// if(this.tabCur == 0) {
|
||||
// this.favoriteBeerList = []
|
||||
// this.beerQuery.pageNum = 1
|
||||
// this.getFavoriteBeerList()
|
||||
// } else {
|
||||
// this.favoriteBreweryList = []
|
||||
// this.breweryQuery.pageNum = 1
|
||||
// this.getFavoriteBreweryList()
|
||||
// }
|
||||
this.tabCur = e.currentTarget.dataset.id
|
||||
},
|
||||
// 获取收藏的酒款列表
|
||||
getFavoriteBeerList() {
|
||||
if (!this.isLogin) return
|
||||
if(this.loading) return
|
||||
this.loading = true
|
||||
|
||||
listMyFavoriteBeer(this.beerQuery).then(res => {
|
||||
this.totalBeer = res.total
|
||||
@ -220,13 +259,13 @@
|
||||
this.favoriteBeerList.push(it)
|
||||
})
|
||||
}
|
||||
}).catch(() => {
|
||||
// 出错时不显示错误提示，因为已经在请求拦截器中处理了
|
||||
}).finally(() => {
|
||||
this.loading = false
|
||||
this.refreshing = false
|
||||
})
|
||||
},
|
||||
// 酒款翻页
|
||||
changeBeerPage() {
|
||||
console.log('f1')
|
||||
if (this.favoriteBeerList.length < this.totalBeer) {
|
||||
this.beerQuery.pageNum++
|
||||
this.getFavoriteBeerList()
|
||||
@ -234,7 +273,8 @@
|
||||
},
|
||||
// 获取收藏的酒厂列表
|
||||
getFavoriteBreweryList() {
|
||||
if (!this.isLogin) return
|
||||
if(this.loading) return
|
||||
this.loading = true
|
||||
|
||||
listMyFavoriteBrewery(this.breweryQuery).then(res => {
|
||||
this.totalBrewery = res.total
|
||||
@ -243,13 +283,13 @@
|
||||
this.favoriteBreweryList.push(it)
|
||||
})
|
||||
}
|
||||
}).catch(() => {
|
||||
// 出错时不显示错误提示，因为已经在请求拦截器中处理了
|
||||
}).finally(() => {
|
||||
this.loading = false
|
||||
this.refreshing = false
|
||||
})
|
||||
},
|
||||
// 品牌方翻页
|
||||
changeBreweryPage() {
|
||||
console.log('f')
|
||||
if (this.favoriteBreweryList.length < this.totalBrewery) {
|
||||
this.breweryQuery.pageNum++
|
||||
this.getFavoriteBreweryList()
|
||||
@ -269,11 +309,6 @@
|
||||
},
|
||||
// 取消关注酒款
|
||||
cancelFavBeer(item) {
|
||||
if (!this.isLogin) {
|
||||
this.toLogin()
|
||||
return
|
||||
}
|
||||
|
||||
let data = {
|
||||
beerId: item.beerId,
|
||||
status: 2
|
||||
@ -286,17 +321,10 @@
|
||||
this.favoriteBeerList = []
|
||||
this.beerQuery.pageNum = 1
|
||||
this.getFavoriteBeerList()
|
||||
}).catch(() => {
|
||||
// 出错时不显示错误提示，因为已经在请求拦截器中处理了
|
||||
})
|
||||
},
|
||||
// 取消关注酒厂
|
||||
cancelFavBrewery(item) {
|
||||
if (!this.isLogin) {
|
||||
this.toLogin()
|
||||
return
|
||||
}
|
||||
|
||||
let data = {
|
||||
breweryId: item.breweryId,
|
||||
status: 2
|
||||
@ -309,11 +337,18 @@
|
||||
this.favoriteBreweryList = []
|
||||
this.breweryQuery.pageNum = 1
|
||||
this.getFavoriteBreweryList()
|
||||
}).catch(() => {
|
||||
// 出错时不显示错误提示，因为已经在请求拦截器中处理了
|
||||
})
|
||||
},
|
||||
|
||||
// 下拉刷新
|
||||
onRefresh() {
|
||||
this.refreshing = true
|
||||
this.beerQuery.pageNum = 1
|
||||
this.breweryQuery.pageNum = 1
|
||||
this.favoriteBeerList = []
|
||||
this.favoriteBreweryList = []
|
||||
this.getFavoriteBeerList()
|
||||
this.getFavoriteBreweryList()
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
@ -53,6 +53,27 @@
|
||||
}
|
||||
},
|
||||
onLoad() {
|
||||
// 测试接口
|
||||
console.log('开始测试接口...')
|
||||
|
||||
// 测试获取我的酒评列表
|
||||
listMyReview({
|
||||
pageNum: 1,
|
||||
pageSize: 10
|
||||
}).then(res => {
|
||||
console.log('获取我的酒评列表测试成功:', res)
|
||||
}).catch(err => {
|
||||
console.error('获取我的酒评列表失败:', err)
|
||||
})
|
||||
|
||||
// 测试删除酒评接口(需要有效的ID)
|
||||
// delReview('xxx').then(res => {
|
||||
// console.log('删除酒评测试成功:', res)
|
||||
// }).catch(err => {
|
||||
// console.error('删除酒评失败:', err)
|
||||
// })
|
||||
|
||||
// 原有的数据加载
|
||||
this.getMyReviewList()
|
||||
},
|
||||
methods: {
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user