feat: 优化我的关注页面 1. 添加接口测试代码 2. 优化数据加载逻辑 3. 添加加载状态控制

This commit is contained in:
davy 2025-04-07 16:09:15 +08:00
parent 5bda409025
commit 59eaa69e5c
3 changed files with 100 additions and 38 deletions

View File

@ -348,6 +348,8 @@ export default {
.page { .page {
min-height: 100vh; min-height: 100vh;
background: #F9F9F9; background: #F9F9F9;
display: flex;
flex-direction: column;
// //
.filter-nav { .filter-nav {
@ -529,7 +531,7 @@ export default {
margin-top: 24rpx; margin-top: 24rpx;
.beer-list { .beer-list {
height: calc(100vh - 300rpx); height: calc(100vh - 200rpx);
.beer-card { .beer-card {
margin-bottom: 24rpx; margin-bottom: 24rpx;
@ -543,7 +545,7 @@ export default {
} }
.empty-state { .empty-state {
padding: 160rpx 0; padding: 120rpx 0;
text-align: center; text-align: center;
.empty-text { .empty-text {
@ -555,17 +557,19 @@ export default {
} }
.loading-status { .loading-status {
padding: 24rpx 0; padding: 8rpx 0;
text-align: center; text-align: center;
.loading-wrapper { .loading-wrapper {
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
height: 32rpx;
.loading-text { .loading-text {
font-size: 24rpx; font-size: 24rpx;
color: #999; color: #999;
line-height: 1;
&::after { &::after {
content: ''; content: '';
display: inline-block; display: inline-block;
@ -583,6 +587,8 @@ export default {
font-size: 24rpx; font-size: 24rpx;
color: #999; color: #999;
opacity: 0.8; opacity: 0.8;
height: 32rpx;
line-height: 32rpx;
} }
} }
} }

View File

@ -115,13 +115,61 @@
pageSize: 10 pageSize: 10
}, },
totalBeer: 0, totalBeer: 0,
totalBrewery: 0 totalBrewery: 0,
loading: false,
refreshing: false
}; };
}, },
onShow() { onShow() {
this.checkLoginStatus() this.checkLoginStatus()
}, },
onLoad() { 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', () => { uni.$on('needLogin', () => {
this.toLogin() this.toLogin()
@ -197,21 +245,12 @@
this.checkLoginStatus() this.checkLoginStatus()
}, },
tabSelect(e) { tabSelect(e) {
console.log(e) this.tabCur = e.currentTarget.dataset.id
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()
// }
}, },
// //
getFavoriteBeerList() { getFavoriteBeerList() {
if (!this.isLogin) return if(this.loading) return
this.loading = true
listMyFavoriteBeer(this.beerQuery).then(res => { listMyFavoriteBeer(this.beerQuery).then(res => {
this.totalBeer = res.total this.totalBeer = res.total
@ -220,13 +259,13 @@
this.favoriteBeerList.push(it) this.favoriteBeerList.push(it)
}) })
} }
}).catch(() => { }).finally(() => {
// this.loading = false
this.refreshing = false
}) })
}, },
// //
changeBeerPage() { changeBeerPage() {
console.log('f1')
if (this.favoriteBeerList.length < this.totalBeer) { if (this.favoriteBeerList.length < this.totalBeer) {
this.beerQuery.pageNum++ this.beerQuery.pageNum++
this.getFavoriteBeerList() this.getFavoriteBeerList()
@ -234,7 +273,8 @@
}, },
// //
getFavoriteBreweryList() { getFavoriteBreweryList() {
if (!this.isLogin) return if(this.loading) return
this.loading = true
listMyFavoriteBrewery(this.breweryQuery).then(res => { listMyFavoriteBrewery(this.breweryQuery).then(res => {
this.totalBrewery = res.total this.totalBrewery = res.total
@ -243,13 +283,13 @@
this.favoriteBreweryList.push(it) this.favoriteBreweryList.push(it)
}) })
} }
}).catch(() => { }).finally(() => {
// this.loading = false
this.refreshing = false
}) })
}, },
// //
changeBreweryPage() { changeBreweryPage() {
console.log('f')
if (this.favoriteBreweryList.length < this.totalBrewery) { if (this.favoriteBreweryList.length < this.totalBrewery) {
this.breweryQuery.pageNum++ this.breweryQuery.pageNum++
this.getFavoriteBreweryList() this.getFavoriteBreweryList()
@ -269,11 +309,6 @@
}, },
// //
cancelFavBeer(item) { cancelFavBeer(item) {
if (!this.isLogin) {
this.toLogin()
return
}
let data = { let data = {
beerId: item.beerId, beerId: item.beerId,
status: 2 status: 2
@ -286,17 +321,10 @@
this.favoriteBeerList = [] this.favoriteBeerList = []
this.beerQuery.pageNum = 1 this.beerQuery.pageNum = 1
this.getFavoriteBeerList() this.getFavoriteBeerList()
}).catch(() => {
//
}) })
}, },
// //
cancelFavBrewery(item) { cancelFavBrewery(item) {
if (!this.isLogin) {
this.toLogin()
return
}
let data = { let data = {
breweryId: item.breweryId, breweryId: item.breweryId,
status: 2 status: 2
@ -309,11 +337,18 @@
this.favoriteBreweryList = [] this.favoriteBreweryList = []
this.breweryQuery.pageNum = 1 this.breweryQuery.pageNum = 1
this.getFavoriteBreweryList() this.getFavoriteBreweryList()
}).catch(() => {
//
}) })
}, },
//
onRefresh() {
this.refreshing = true
this.beerQuery.pageNum = 1
this.breweryQuery.pageNum = 1
this.favoriteBeerList = []
this.favoriteBreweryList = []
this.getFavoriteBeerList()
this.getFavoriteBreweryList()
}
} }
} }
</script> </script>

View File

@ -53,6 +53,27 @@
} }
}, },
onLoad() { 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() this.getMyReviewList()
}, },
methods: { methods: {