374 lines
9.0 KiB
JavaScript
374 lines
9.0 KiB
JavaScript
import { fetchGoodsList } from '../../../services/good/fetchGoodsList';
|
||
import Toast from 'tdesign-miniprogram/toast/index';
|
||
|
||
const initFilters = {
|
||
overall: 1,
|
||
sorts: '',
|
||
layout: 0,
|
||
};
|
||
|
||
Page({
|
||
data: {
|
||
goodsList: [],
|
||
layout: 0,
|
||
sorts: '',
|
||
overall: 1,
|
||
show: false,
|
||
minVal: '',
|
||
maxVal: '',
|
||
prices: [],
|
||
filter: initFilters,
|
||
hasLoaded: false,
|
||
loadMoreStatus: 0,
|
||
loading: true,
|
||
categoryId: '',
|
||
categoryName: '',
|
||
keywords: '',
|
||
},
|
||
|
||
pageNum: 1,
|
||
pageSize: 30,
|
||
total: 0,
|
||
|
||
handleFilterChange(e) {
|
||
const { layout, overall, sorts } = e.detail;
|
||
const { sorts: oldSorts, overall: oldOverall, layout: oldLayout } = this.data;
|
||
|
||
console.log('[GoodsList] 筛选条件变化:', {
|
||
oldState: {
|
||
layout: oldLayout === 1 ? '列表' : '网格',
|
||
overall: oldOverall === 1 ? '综合排序' : '其他排序',
|
||
sorts: oldSorts || '默认'
|
||
},
|
||
newState: {
|
||
layout: layout === 1 ? '列表' : '网格',
|
||
overall: overall === 1 ? '综合排序' : '其他排序',
|
||
sorts: sorts || '默认'
|
||
},
|
||
sortText: sorts === 'asc' ? '价格从低到高' : sorts === 'desc' ? '价格从高到低' : '默认排序',
|
||
timestamp: new Date().toLocaleString(),
|
||
action: '重置页码并重新加载商品列表'
|
||
});
|
||
|
||
this.pageNum = 1;
|
||
this.setData({
|
||
layout,
|
||
sorts,
|
||
overall,
|
||
filter: {
|
||
layout,
|
||
overall,
|
||
sorts,
|
||
},
|
||
loadMoreStatus: 0,
|
||
});
|
||
|
||
console.log('[GoodsList] 开始重新加载商品列表:', {
|
||
pageNum: this.pageNum,
|
||
timestamp: new Date().toLocaleString()
|
||
});
|
||
|
||
this.init(true);
|
||
},
|
||
|
||
generalQueryData(reset = false) {
|
||
const { keywords, minVal, maxVal, sorts, overall } = this.data;
|
||
const { pageNum, pageSize } = this;
|
||
const params = {
|
||
sort: overall === 1 ? 0 : 1, // 0 综合，1 价格
|
||
pageNum: reset ? 1 : pageNum,
|
||
pageSize: pageSize,
|
||
keyword: keywords || '',
|
||
};
|
||
|
||
console.log('[GoodsList] 构建查询参数 - 基础参数:', {
|
||
overall: overall === 1 ? '综合排序' : '其他排序',
|
||
sorts: sorts || '默认',
|
||
pageNum: params.pageNum,
|
||
pageSize: params.pageSize,
|
||
keyword: params.keyword,
|
||
reset: reset,
|
||
timestamp: new Date().toLocaleString()
|
||
});
|
||
|
||
// 添加分类ID参数
|
||
if (this.categoryId) {
|
||
params.category_id = this.categoryId;
|
||
console.log('[GoodsList] 添加分类参数:', {
|
||
categoryId: this.categoryId,
|
||
categoryName: this.data.categoryName || '未知分类'
|
||
});
|
||
}
|
||
|
||
// 设置排序参数
|
||
if (sorts && sorts !== '') {
|
||
params.sort = 1;
|
||
params.sortType = sorts === 'desc' ? 1 : 0;
|
||
console.log('[GoodsList] 设置价格排序参数:', {
|
||
sorts: sorts,
|
||
sortType: params.sortType,
|
||
sortText: sorts === 'desc' ? '价格从高到低' : '价格从低到高'
|
||
});
|
||
}
|
||
|
||
// 设置价格筛选参数（传输单位改为“分”，乘以100并取整）
|
||
const min = Number(minVal);
|
||
const max = Number(maxVal);
|
||
if (!Number.isNaN(min) && min > 0) {
|
||
params.minPrice = Math.round(min * 100);
|
||
console.log('[GoodsList] 设置最低价格(分):', params.minPrice);
|
||
}
|
||
if (!Number.isNaN(max) && max > 0) {
|
||
params.maxPrice = Math.round(max * 100);
|
||
console.log('[GoodsList] 设置最高价格(分):', params.maxPrice);
|
||
}
|
||
|
||
console.log('[GoodsList] 最终查询参数:', {
|
||
params: params,
|
||
timestamp: new Date().toLocaleString()
|
||
});
|
||
|
||
if (reset) return params;
|
||
return {
|
||
...params,
|
||
pageNum: pageNum + 1,
|
||
};
|
||
},
|
||
|
||
async init(reset = true) {
|
||
const { loadMoreStatus, goodsList = [] } = this.data;
|
||
const params = this.generalQueryData(reset);
|
||
if (loadMoreStatus !== 0) return;
|
||
this.setData({
|
||
loadMoreStatus: 1,
|
||
loading: true,
|
||
});
|
||
try {
|
||
const result = await fetchGoodsList(params);
|
||
console.log('[GoodsList] API调用结果:', {
|
||
result: result,
|
||
hasSpuList: !!result.spuList,
|
||
spuListLength: result.spuList ? result.spuList.length : 0,
|
||
totalCount: result.totalCount,
|
||
timestamp: new Date().toLocaleString()
|
||
});
|
||
|
||
if (result && result.spuList) {
|
||
const { spuList, totalCount = 0 } = result;
|
||
if (totalCount === 0 && reset) {
|
||
this.total = totalCount;
|
||
this.setData({
|
||
emptyInfo: {
|
||
tip: '抱歉，未找到相关商品',
|
||
},
|
||
hasLoaded: true,
|
||
loadMoreStatus: 0,
|
||
loading: false,
|
||
goodsList: [],
|
||
});
|
||
return;
|
||
}
|
||
|
||
const _goodsList = reset ? spuList : goodsList.concat(spuList);
|
||
const _loadMoreStatus = _goodsList.length === totalCount ? 2 : 0;
|
||
this.pageNum = params.pageNum || 1;
|
||
this.total = totalCount;
|
||
|
||
console.log('[GoodsList] 更新商品列表数据:', {
|
||
reset: reset,
|
||
oldGoodsListLength: goodsList.length,
|
||
newGoodsListLength: _goodsList.length,
|
||
totalCount: totalCount,
|
||
loadMoreStatus: _loadMoreStatus,
|
||
timestamp: new Date().toLocaleString()
|
||
});
|
||
|
||
this.setData({
|
||
goodsList: _goodsList,
|
||
loadMoreStatus: _loadMoreStatus,
|
||
});
|
||
} else {
|
||
console.error('[GoodsList] API返回数据格式错误:', result);
|
||
this.setData({
|
||
loading: false,
|
||
});
|
||
wx.showToast({
|
||
title: '查询失败，请稍候重试',
|
||
});
|
||
}
|
||
} catch (error) {
|
||
this.setData({
|
||
loading: false,
|
||
});
|
||
}
|
||
this.setData({
|
||
hasLoaded: true,
|
||
loading: false,
|
||
});
|
||
},
|
||
|
||
onLoad(options) {
|
||
// 接收分类参数
|
||
if (options.categoryId) {
|
||
this.categoryId = options.categoryId;
|
||
this.setData({
|
||
categoryId: options.categoryId,
|
||
categoryName: decodeURIComponent(options.categoryName || ''),
|
||
});
|
||
}
|
||
|
||
// 接收搜索关键词参数
|
||
if (options.keyword) {
|
||
this.setData({
|
||
keywords: decodeURIComponent(options.keyword),
|
||
});
|
||
}
|
||
|
||
this.init(true);
|
||
},
|
||
|
||
onReachBottom() {
|
||
const { goodsList } = this.data;
|
||
const { total = 0 } = this;
|
||
if (goodsList.length === total) {
|
||
this.setData({
|
||
loadMoreStatus: 2,
|
||
});
|
||
return;
|
||
}
|
||
this.init(false);
|
||
},
|
||
|
||
handleAddCart() {
|
||
Toast({
|
||
context: this,
|
||
selector: '#t-toast',
|
||
message: '点击加购',
|
||
});
|
||
},
|
||
|
||
tagClickHandle() {
|
||
Toast({
|
||
context: this,
|
||
selector: '#t-toast',
|
||
message: '点击标签',
|
||
});
|
||
},
|
||
|
||
gotoGoodsDetail(e) {
|
||
const { index } = e.detail;
|
||
const { spuId } = this.data.goodsList[index];
|
||
wx.navigateTo({
|
||
url: `/pages/goods/details/index?spuId=${spuId}`,
|
||
});
|
||
},
|
||
|
||
showFilterPopup() {
|
||
this.setData({
|
||
show: true,
|
||
});
|
||
},
|
||
|
||
showFilterPopupClose() {
|
||
this.setData({
|
||
show: false,
|
||
});
|
||
},
|
||
|
||
onMinValAction(e) {
|
||
const { value } = e.detail;
|
||
this.setData({ minVal: value });
|
||
},
|
||
|
||
onMaxValAction(e) {
|
||
const { value } = e.detail;
|
||
this.setData({ maxVal: value });
|
||
},
|
||
|
||
reset() {
|
||
this.pageNum = 1;
|
||
this.setData({
|
||
minVal: '',
|
||
maxVal: '',
|
||
prices: [],
|
||
goodsList: [],
|
||
loadMoreStatus: 0,
|
||
}, () => {
|
||
this.init(true);
|
||
});
|
||
},
|
||
|
||
confirm() {
|
||
const { minVal, maxVal } = this.data;
|
||
|
||
// 验证价格范围
|
||
if (minVal && maxVal && parseFloat(minVal) > parseFloat(maxVal)) {
|
||
Toast({
|
||
context: this,
|
||
selector: '#t-toast',
|
||
message: '最低价不能大于最高价',
|
||
});
|
||
return;
|
||
}
|
||
|
||
// 构建价格筛选数组
|
||
const prices = [];
|
||
if (minVal || maxVal) {
|
||
prices.push({
|
||
min: minVal || 0,
|
||
max: maxVal || '不限'
|
||
});
|
||
}
|
||
|
||
// 应用价格筛选
|
||
this.pageNum = 1;
|
||
this.setData(
|
||
{
|
||
show: false,
|
||
prices: prices,
|
||
goodsList: [],
|
||
loadMoreStatus: 0,
|
||
},
|
||
() => {
|
||
this.init(true);
|
||
},
|
||
);
|
||
},
|
||
|
||
// 分享功能
|
||
onShareAppMessage() {
|
||
const { categoryName, keywords } = this.data;
|
||
let title = '精选商品列表';
|
||
let path = '/pages/goods/list/index';
|
||
|
||
if (categoryName) {
|
||
title = `${categoryName} - 精选商品`;
|
||
path = `/pages/goods/list/index?categoryId=${this.categoryId}&categoryName=${encodeURIComponent(categoryName)}`;
|
||
} else if (keywords) {
|
||
title = `${keywords} - 搜索结果`;
|
||
path = `/pages/goods/list/index?keywords=${encodeURIComponent(keywords)}`;
|
||
}
|
||
|
||
return {
|
||
title: title,
|
||
path: path
|
||
};
|
||
},
|
||
|
||
// 分享到朋友圈
|
||
onShareTimeline() {
|
||
const { categoryName, keywords } = this.data;
|
||
let title = '精选商品列表';
|
||
|
||
if (categoryName) {
|
||
title = `${categoryName} - 精选商品`;
|
||
} else if (keywords) {
|
||
title = `${keywords} - 搜索结果`;
|
||
}
|
||
|
||
return {
|
||
title: title
|
||
};
|
||
}
|
||
});
|