This commit is contained in:
parent
1492f3930c
commit
6e3f3127f4
|
|
@ -199,10 +199,10 @@
|
|||
:refresher-triggered="refreshing"
|
||||
>
|
||||
<view class="pets-list">
|
||||
<!-- 结果统计 -->
|
||||
<view class="result-summary" v-if="displayPets.length > 0">
|
||||
<!-- 结果统计 - 已隐藏 -->
|
||||
<!-- <view class="result-summary" v-if="displayPets.length > 0">
|
||||
<text class="summary-text">找到 {{ totalPets }} 只可爱的小伙伴</text>
|
||||
</view>
|
||||
</view> -->
|
||||
|
||||
<!-- 宠物卡片 -->
|
||||
<view
|
||||
|
|
@ -319,7 +319,7 @@ export default {
|
|||
|
||||
// 分页
|
||||
page: 1,
|
||||
pageSize: 10,
|
||||
pageSize: 20,
|
||||
hasMorePets: true,
|
||||
loadingMore: false,
|
||||
refreshing: false
|
||||
|
|
@ -381,21 +381,29 @@ export default {
|
|||
|
||||
methods: {
|
||||
loadPets() {
|
||||
console.log('loadPets called')
|
||||
// 强制清除本地存储，重新初始化数据
|
||||
uni.removeStorageSync('adoption_pets')
|
||||
this.allPets = adoptionManager.getAdoptionPets()
|
||||
console.log('allPets loaded:', this.allPets.length, this.allPets)
|
||||
this.applyFiltersAndSearch()
|
||||
},
|
||||
|
||||
applyFiltersAndSearch() {
|
||||
console.log('applyFiltersAndSearch called, allPets:', this.allPets.length)
|
||||
let filteredPets = [...this.allPets]
|
||||
|
||||
// 应用搜索
|
||||
if (this.searchKeyword) {
|
||||
console.log('applying search:', this.searchKeyword)
|
||||
filteredPets = adoptionManager.searchPets(this.searchKeyword, filteredPets)
|
||||
}
|
||||
|
||||
// 应用筛选
|
||||
const filters = this.buildFilters()
|
||||
console.log('applying filters:', filters)
|
||||
filteredPets = adoptionManager.filterPets(filters, filteredPets)
|
||||
console.log('filtered pets:', filteredPets.length)
|
||||
|
||||
// 排序（按发布时间倒序）
|
||||
filteredPets.sort((a, b) => new Date(b.publishTime) - new Date(a.publishTime))
|
||||
|
|
@ -403,6 +411,7 @@ export default {
|
|||
this.totalPets = filteredPets.length
|
||||
this.displayPets = filteredPets.slice(0, this.page * this.pageSize)
|
||||
this.hasMorePets = filteredPets.length > this.displayPets.length
|
||||
console.log('final displayPets:', this.displayPets.length)
|
||||
},
|
||||
|
||||
buildFilters() {
|
||||
|
|
@ -459,7 +468,9 @@ export default {
|
|||
|
||||
// 筛选面板
|
||||
toggleFilter() {
|
||||
console.log('toggleFilter clicked, current showFilter:', this.showFilter)
|
||||
this.showFilter = !this.showFilter
|
||||
console.log('toggleFilter after, new showFilter:', this.showFilter)
|
||||
},
|
||||
|
||||
// 地区筛选
|
||||
|
|
@ -705,6 +716,10 @@ export default {
|
|||
backdrop-filter: blur(20rpx);
|
||||
padding: 24rpx 32rpx;
|
||||
border-bottom: 1rpx solid rgba(255, 255, 255, 0.3);
|
||||
position: relative;
|
||||
z-index: 10;
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
|
||||
.filter-section {
|
||||
margin-bottom: 32rpx;
|
||||
|
|
@ -933,14 +948,18 @@ export default {
|
|||
}
|
||||
|
||||
.pets-list {
|
||||
padding-bottom: 20rpx;
|
||||
padding-bottom: 60rpx;
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 1fr;
|
||||
gap: 16rpx;
|
||||
}
|
||||
|
||||
.result-summary {
|
||||
text-align: center;
|
||||
padding: 24rpx 0;
|
||||
grid-column: 1 / -1;
|
||||
|
||||
.summary-text {
|
||||
font-size: 24rpx;
|
||||
|
|
@ -952,13 +971,11 @@ export default {
|
|||
.pet-card {
|
||||
background: rgba(255, 255, 255, 0.95);
|
||||
backdrop-filter: blur(20rpx);
|
||||
border-radius: 16rpx;
|
||||
padding: 16rpx;
|
||||
margin: 0 0 16rpx 0;
|
||||
border-radius: 12rpx;
|
||||
padding: 12rpx;
|
||||
box-shadow: 0 2rpx 12rpx rgba(255, 138, 128, 0.08);
|
||||
border: 1rpx solid rgba(255, 255, 255, 0.3);
|
||||
transition: all 0.3s ease;
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
|
||||
&:active {
|
||||
|
|
@ -969,10 +986,10 @@ export default {
|
|||
.pet-image-container {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
height: 280rpx;
|
||||
border-radius: 16rpx;
|
||||
height: 200rpx;
|
||||
border-radius: 12rpx;
|
||||
overflow: hidden;
|
||||
margin-bottom: 12rpx;
|
||||
margin-bottom: 8rpx;
|
||||
|
||||
.pet-image {
|
||||
width: 100%;
|
||||
|
|
@ -1019,26 +1036,28 @@ export default {
|
|||
|
||||
.pet-info {
|
||||
.pet-basic {
|
||||
margin-bottom: 16rpx;
|
||||
margin-bottom: 12rpx;
|
||||
|
||||
.pet-name {
|
||||
font-size: 32rpx;
|
||||
font-size: 26rpx;
|
||||
font-weight: bold;
|
||||
color: #333333;
|
||||
margin-bottom: 8rpx;
|
||||
margin-bottom: 6rpx;
|
||||
display: block;
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
.pet-tags {
|
||||
display: flex;
|
||||
gap: 8rpx;
|
||||
gap: 6rpx;
|
||||
flex-wrap: wrap;
|
||||
|
||||
.pet-type,
|
||||
.pet-breed {
|
||||
background: rgba(255, 138, 128, 0.1);
|
||||
border-radius: 12rpx;
|
||||
padding: 4rpx 12rpx;
|
||||
font-size: 20rpx;
|
||||
border-radius: 8rpx;
|
||||
padding: 2rpx 8rpx;
|
||||
font-size: 18rpx;
|
||||
color: #FF8A80;
|
||||
}
|
||||
}
|
||||
|
|
@ -1046,20 +1065,21 @@ export default {
|
|||
|
||||
.pet-details {
|
||||
display: flex;
|
||||
gap: 24rpx;
|
||||
margin-bottom: 16rpx;
|
||||
gap: 16rpx;
|
||||
margin-bottom: 12rpx;
|
||||
flex-wrap: wrap;
|
||||
|
||||
.detail-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 6rpx;
|
||||
gap: 4rpx;
|
||||
|
||||
.detail-icon {
|
||||
font-size: 16rpx;
|
||||
font-size: 14rpx;
|
||||
}
|
||||
|
||||
.detail-text {
|
||||
font-size: 20rpx;
|
||||
font-size: 18rpx;
|
||||
color: #666666;
|
||||
}
|
||||
}
|
||||
|
|
@ -1068,16 +1088,16 @@ export default {
|
|||
.pet-personality {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 8rpx;
|
||||
margin-bottom: 16rpx;
|
||||
gap: 6rpx;
|
||||
margin-bottom: 12rpx;
|
||||
|
||||
.personality-tag {
|
||||
background: rgba(255, 138, 128, 0.05);
|
||||
border-radius: 12rpx;
|
||||
padding: 6rpx 12rpx;
|
||||
border-radius: 8rpx;
|
||||
padding: 4rpx 8rpx;
|
||||
|
||||
.trait-text {
|
||||
font-size: 18rpx;
|
||||
font-size: 16rpx;
|
||||
color: #666666;
|
||||
}
|
||||
}
|
||||
|
|
@ -1110,6 +1130,7 @@ export default {
|
|||
.load-more {
|
||||
text-align: center;
|
||||
padding: 40rpx 0;
|
||||
grid-column: 1 / -1;
|
||||
|
||||
.loading-indicator {
|
||||
.loading-text {
|
||||
|
|
@ -1129,6 +1150,7 @@ export default {
|
|||
.empty-state {
|
||||
text-align: center;
|
||||
padding: 120rpx 40rpx;
|
||||
grid-column: 1 / -1;
|
||||
|
||||
.empty-icon {
|
||||
font-size: 120rpx;
|
||||
|
|
|
|||
Loading…
Reference in New Issue