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