diff --git a/pages/car_new/car_new.js b/pages/car_new/car_new.js
index 027df77..9fd18e8 100644
--- a/pages/car_new/car_new.js
+++ b/pages/car_new/car_new.js
@@ -22,7 +22,18 @@ Page({
{ text: '5-10万', value: '5-10'},
{ text: '10万以上', value: '>10' }
],
- extendFields: [] // 筛选配置
+ extendFields: [], // 筛选配置
+
+ // 分页相关
+ page: 1,
+ pageSize: 10,
+ hasMore: true,
+ loading: false,
+ loadingMore: false,
+
+ // 数据状态
+ showNoData: false,
+ firstLoad: true
},
onBrandClick(e) {
const index = e.detail.index;
@@ -41,7 +52,19 @@ Page({
this.selectComponent('#dropdownItemBrand').toggle(false); // 关闭下拉菜单
}
},
-
+ // 下拉刷新事件
+ onPullDownRefresh() {
+ this.reloadList();
+ wx.stopPullDownRefresh();
+ },
+
+ // 滑动到底部加载更多
+ onReachBottom() {
+ if (this.data.hasMore && !this.data.loadingMore) {
+ this.loadMoreData();
+ }
+ },
+
onSeriesSelect(e) {
const selectedId = e.detail.id;
const selectedText = e.detail.text;
@@ -70,25 +93,104 @@ Page({
},
async reloadList() {
- // TODO: 根据筛选值重新加载列表
+ // 重新加载列表，重置分页
+ this.setData({
+ page: 1,
+ hasMore: true,
+ loading: true,
+ showNoData: false
+ });
+
const data = {
- sort:this.data.selectedSort,
- brand:this.data.selectedSeriesId,
- price:this.data.selectedPrice,
- attr:this.data.filterParams,
- type:this.data.type,
- }
+ sort: this.data.selectedSort,
+ brand: this.data.selectedSeriesId,
+ price: this.data.selectedPrice,
+ attr: this.data.filterParams,
+ type: this.data.type,
+ page: 1,
+ pageSize: this.data.pageSize
+ };
+
try {
const raw = await request({
url: '/admin/wechat/api/car',
method: 'POST',
data: data
});
- this.setData({carList:raw.items})
+
+ const items = raw.items || [];
+ const total = raw.total || 0;
+
+ this.setData({
+ carList: items,
+ hasMore: items.length >= this.data.pageSize && items.length < total,
+ loading: false,
+ showNoData: items.length === 0 && !this.data.firstLoad,
+ firstLoad: false
+ });
} catch (err) {
- console.error('加载品牌失败', err);
+ console.error('加载列表失败', err);
+ this.setData({
+ loading: false,
+ showNoData: this.data.carList.length === 0
+ });
+
+ wx.showToast({
+ title: '加载失败',
+ icon: 'none'
+ });
}
},
+
+ async loadMoreData() {
+ if (this.data.loadingMore || !this.data.hasMore) return;
+
+ const nextPage = this.data.page + 1;
+ this.setData({
+ loadingMore: true
+ });
+
+ const data = {
+ sort: this.data.selectedSort,
+ brand: this.data.selectedSeriesId,
+ price: this.data.selectedPrice,
+ attr: this.data.filterParams,
+ type: this.data.type,
+ page: nextPage,
+ pageSize: this.data.pageSize
+ };
+
+ try {
+ const raw = await request({
+ url: '/admin/wechat/api/car',
+ method: 'POST',
+ data: data
+ });
+
+ const items = raw.items || [];
+ const total = raw.total || 0;
+ const currentTotal = this.data.carList.length + items.length;
+
+ this.setData({
+ carList: [...this.data.carList, ...items],
+ page: nextPage,
+ hasMore: items.length >= this.data.pageSize && currentTotal < total,
+ loadingMore: false
+ });
+
+ } catch (err) {
+ console.error('加载更多失败', err);
+ this.setData({
+ loadingMore: false
+ });
+
+ wx.showToast({
+ title: '加载失败',
+ icon: 'none'
+ });
+ }
+ },
+
openMap() {
const { latitude, longitude, address, name } = this.data.company
wx.openLocation({
@@ -207,4 +309,4 @@ Page({
this.setData({filterParams:filterParams});
this.reloadList();
}
-})
+})
\ No newline at end of file
diff --git a/pages/car_new/car_new.json b/pages/car_new/car_new.json
index 91d054c..d234a0b 100644
--- a/pages/car_new/car_new.json
+++ b/pages/car_new/car_new.json
@@ -7,5 +7,6 @@
"van-slider": "@vant/weapp/slider/index",
"van-tag": "@vant/weapp/tag/index",
"van-button": "@vant/weapp/button/index"
- }
+ },
+ "enablePullDownRefresh": true
}
\ No newline at end of file
diff --git a/pages/car_new/car_new.wxml b/pages/car_new/car_new.wxml
index 00ec598..d6a8b8c 100644
--- a/pages/car_new/car_new.wxml
+++ b/pages/car_new/car_new.wxml
@@ -153,4 +153,28 @@
+
+
+
+
+ 加载中...
+
+
+
+
+
+
+ 暂无数据
+ 换个条件试试吧
+
+
+
+
+
+ 加载更多...
+
+
+ 没有更多数据了
+
+
\ No newline at end of file
diff --git a/pages/car_new/car_new.wxss b/pages/car_new/car_new.wxss
index 3ae7db9..72987ff 100644
--- a/pages/car_new/car_new.wxss
+++ b/pages/car_new/car_new.wxss
@@ -376,5 +376,121 @@
color: #999;
font-size: 24rpx;
}
+/* 加载状态 */
+.loading-container {
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ padding: 40rpx;
+ background: white;
+ margin: 20rpx;
+ border-radius: 16rpx;
+}
+.loading-spinner {
+ display: flex;
+ align-items: center;
+ color: #666;
+ font-size: 28rpx;
+}
+
+.loading-spinner::before {
+ content: '';
+ width: 32rpx;
+ height: 32rpx;
+ border: 4rpx solid #e0e0e0;
+ border-top: 4rpx solid #007aff;
+ border-radius: 50%;
+ animation: spin 1s linear infinite;
+ margin-right: 16rpx;
+}
+
+@keyframes spin {
+ 0% { transform: rotate(0deg); }
+ 100% { transform: rotate(360deg); }
+}
+
+/* 无数据状态 */
+.no-data-container {
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: center;
+ padding: 120rpx 40rpx;
+ background: white;
+ margin: 20rpx;
+ border-radius: 16rpx;
+}
+
+.no-data-icon {
+ width: 200rpx;
+ height: 200rpx;
+ margin-bottom: 40rpx;
+ opacity: 0.6;
+}
+
+.no-data-text {
+ font-size: 32rpx;
+ color: #666;
+ margin-bottom: 16rpx;
+ font-weight: 500;
+}
+
+.no-data-desc {
+ font-size: 28rpx;
+ color: #999;
+ text-align: center;
+ line-height: 1.5;
+}
+
+/* 加载更多状态 */
+.load-more-container {
+ padding: 20rpx;
+}
+
+.load-more-item,.load-more-item-no {
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ padding: 30rpx;
+ color: #999;
+ font-size: 28rpx;
+ background: white;
+ border-radius: 16rpx;
+}
+
+.load-more-item text {
+ position: relative;
+}
+
+/* 加载更多动画 */
+.load-more-item:first-child text::before {
+ content: '';
+ width: 24rpx;
+ height: 24rpx;
+ border: 3rpx solid #e0e0e0;
+ border-top: 3rpx solid #007aff;
+ border-radius: 50%;
+ animation: spin 1s linear infinite;
+ margin-right: 12rpx;
+ display: inline-block;
+ vertical-align: middle;
+}
+
+/* 响应式适配 */
+@media (max-width: 750rpx) {
+ .car-item {
+ margin-bottom: 16rpx;
+ padding: 20rpx;
+ }
+
+ .no-data-container {
+ padding: 80rpx 20rpx;
+ }
+
+ .no-data-icon {
+ width: 160rpx;
+ height: 160rpx;
+ }
+}
diff --git a/pages/info/info.wxml b/pages/info/info.wxml
index 523e29e..55b1517 100644
--- a/pages/info/info.wxml
+++ b/pages/info/info.wxml
@@ -82,16 +82,16 @@
-
+
-
+
diff --git a/utils/request.js b/utils/request.js
index 691c734..2c2ba3f 100644
--- a/utils/request.js
+++ b/utils/request.js
@@ -1,4 +1,4 @@
-const BASE_URL = 'http://car.cherrybless.com'; // 👈 换成你的后端地址
+const BASE_URL = 'https://car.cherrybless.com'; // 👈 换成你的后端地址
function request({ url, method = 'GET', data = {}, header = {} }) {
const token = '';