You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
461 lines
12 KiB
461 lines
12 KiB
// pages/favorites/index.js
|
|
const API = require('../../utils/api.js');
|
|
|
|
Page({
|
|
|
|
/**
|
|
* 页面的初始数据
|
|
*/
|
|
data: {
|
|
favoritesList: [],
|
|
loading: true,
|
|
hasFavorites: false,
|
|
|
|
// 图片预览相关状态
|
|
showImagePreview: false, // 控制图片预览弹窗显示
|
|
previewImageUrls: [], // 预览的图片URL列表
|
|
previewImageIndex: 0, // 当前预览图片的索引
|
|
|
|
// 图片缩放相关状态
|
|
scale: 1, // 当前缩放比例
|
|
lastScale: 1, // 上一次缩放比例
|
|
startDistance: 0, // 双指起始距离
|
|
doubleTapTimer: null, // 双击计时器
|
|
lastTapTime: 0, // 上一次单击时间
|
|
isScaling: false, // 是否正在缩放中
|
|
offsetX: 0, // X轴偏移量
|
|
offsetY: 0, // Y轴偏移量
|
|
initialTouch: null // 初始触摸点
|
|
},
|
|
|
|
/**
|
|
* 生命周期函数--监听页面加载
|
|
*/
|
|
onLoad(options) {
|
|
this.loadFavorites();
|
|
|
|
// 添加收藏状态变化事件监听
|
|
const app = getApp();
|
|
this.favoriteChangedHandler = (data) => {
|
|
console.log('收藏页面收到收藏状态变化通知:', data);
|
|
// 重新加载收藏列表以更新状态
|
|
this.loadFavorites();
|
|
};
|
|
app.eventBus.on('favoriteChanged', this.favoriteChangedHandler);
|
|
},
|
|
|
|
/**
|
|
* 生命周期函数--监听页面初次渲染完成
|
|
*/
|
|
onReady() {
|
|
|
|
},
|
|
|
|
/**
|
|
* 生命周期函数--监听页面显示
|
|
*/
|
|
onShow() {
|
|
// 每次显示页面时重新加载收藏列表
|
|
this.loadFavorites();
|
|
|
|
// 更新自定义tabBar状态
|
|
if (typeof this.getTabBar === 'function' && this.getTabBar()) {
|
|
this.getTabBar().setData({
|
|
selected: 3
|
|
});
|
|
}
|
|
// 更新全局tab状态
|
|
const app = getApp();
|
|
if (app.updateCurrentTab) {
|
|
app.updateCurrentTab('favorites');
|
|
}
|
|
},
|
|
|
|
/**
|
|
* 生命周期函数--监听页面隐藏
|
|
*/
|
|
onHide() {
|
|
|
|
},
|
|
|
|
/**
|
|
* 生命周期函数--监听页面卸载
|
|
*/
|
|
onUnload() {
|
|
// 移除事件监听
|
|
const app = getApp();
|
|
if (this.favoriteChangedHandler) {
|
|
app.eventBus.off('favoriteChanged', this.favoriteChangedHandler);
|
|
console.log('收藏页面移除收藏状态变化事件监听');
|
|
}
|
|
},
|
|
|
|
/**
|
|
* 页面相关事件处理函数--监听用户下拉动作
|
|
*/
|
|
onPullDownRefresh() {
|
|
// 下拉刷新时重新加载收藏列表
|
|
this.loadFavorites(true);
|
|
},
|
|
|
|
/**
|
|
* 页面上拉触底事件的处理函数
|
|
*/
|
|
onReachBottom() {
|
|
|
|
},
|
|
|
|
/**
|
|
* 用户点击右上角分享
|
|
*/
|
|
onShareAppMessage() {
|
|
|
|
},
|
|
|
|
/**
|
|
* 加载收藏列表
|
|
*/
|
|
loadFavorites: function (isPullDown = false) {
|
|
this.setData({
|
|
loading: true
|
|
});
|
|
|
|
// 获取手机号码 - 使用与API.js一致的获取方式
|
|
const users = wx.getStorageSync('users') || {};
|
|
const userId = wx.getStorageSync('userId');
|
|
let phoneNumber = null;
|
|
|
|
// 尝试从users中获取手机号
|
|
if (userId && users[userId] && users[userId].phoneNumber) {
|
|
phoneNumber = users[userId].phoneNumber;
|
|
} else {
|
|
// 尝试从全局用户信息获取
|
|
const userInfo = wx.getStorageSync('userInfo');
|
|
if (userInfo && userInfo.phoneNumber) {
|
|
phoneNumber = userInfo.phoneNumber;
|
|
} else {
|
|
// 尝试从直接存储的phoneNumber获取
|
|
phoneNumber = wx.getStorageSync('phoneNumber');
|
|
}
|
|
}
|
|
|
|
// 检查用户是否登录
|
|
if (!phoneNumber) {
|
|
// 用户未登录，显示提示
|
|
wx.showToast({
|
|
title: '请先登录',
|
|
icon: 'none'
|
|
});
|
|
this.setData({
|
|
loading: false,
|
|
hasFavorites: false
|
|
});
|
|
if (isPullDown) {
|
|
wx.stopPullDownRefresh();
|
|
}
|
|
return;
|
|
}
|
|
|
|
API.getFavorites(phoneNumber).then(res => {
|
|
console.log('获取收藏列表成功:', res);
|
|
// 检查API返回是否成功
|
|
if (res && res.code === 200 && res.data) {
|
|
let favorites = res.data.favorites || [];
|
|
|
|
// 转换supplyStatus字段值
|
|
favorites = favorites.map(item => {
|
|
if (item.Product && item.Product.supplyStatus) {
|
|
// 将supplyStatus由"平台货源"、"三方认证"、"三方未认证"修改为"预售"、"现货"
|
|
// 平台货源和三方认证转为现货，三方未认证转为预售
|
|
if (['平台货源', '三方认证'].includes(item.Product.supplyStatus)) {
|
|
item.Product.supplyStatus = "现货";
|
|
} else if (item.Product.supplyStatus === '三方未认证') {
|
|
item.Product.supplyStatus = "预售";
|
|
}
|
|
}
|
|
return item;
|
|
});
|
|
|
|
this.setData({
|
|
favoritesList: favorites,
|
|
hasFavorites: favorites.length > 0,
|
|
loading: false
|
|
});
|
|
} else {
|
|
// API返回格式不正确
|
|
this.setData({
|
|
loading: false,
|
|
hasFavorites: false
|
|
});
|
|
wx.showToast({
|
|
title: '数据获取失败',
|
|
icon: 'none'
|
|
});
|
|
}
|
|
}).catch(err => {
|
|
console.error('获取收藏列表失败:', err);
|
|
wx.showToast({
|
|
title: '获取收藏列表失败',
|
|
icon: 'none'
|
|
});
|
|
this.setData({
|
|
loading: false,
|
|
hasFavorites: false
|
|
});
|
|
}).finally(() => {
|
|
// 停止下拉刷新
|
|
if (isPullDown) {
|
|
wx.stopPullDownRefresh();
|
|
}
|
|
});
|
|
},
|
|
|
|
/**
|
|
* 取消收藏
|
|
*/
|
|
cancelFavorite: function (e) {
|
|
const productId = e.currentTarget.dataset.productid;
|
|
wx.showLoading({
|
|
title: '正在取消收藏',
|
|
mask: true
|
|
});
|
|
|
|
API.cancelFavorite(productId).then(res => {
|
|
console.log('取消收藏成功:', res);
|
|
// 从收藏列表中移除该商品
|
|
const updatedList = this.data.favoritesList.filter(item => item.productId !== productId);
|
|
this.setData({
|
|
favoritesList: updatedList,
|
|
hasFavorites: updatedList.length > 0
|
|
});
|
|
wx.showToast({
|
|
title: '取消收藏成功',
|
|
icon: 'success'
|
|
});
|
|
|
|
// 触发全局事件，通知其他页面收藏状态已更改
|
|
const app = getApp();
|
|
app.eventBus.emit('favoriteChanged', {
|
|
productId: productId,
|
|
isFavorite: false
|
|
});
|
|
}).catch(err => {
|
|
console.error('取消收藏失败:', err);
|
|
wx.showToast({
|
|
title: '取消收藏失败',
|
|
icon: 'none'
|
|
});
|
|
}).finally(() => {
|
|
wx.hideLoading();
|
|
});
|
|
},
|
|
|
|
/**
|
|
* 跳转到商品详情页
|
|
*/
|
|
goToGoodsDetail: function (e) {
|
|
// 检查用户是否登录
|
|
const openid = wx.getStorageSync('openid');
|
|
const userId = wx.getStorageSync('userId');
|
|
|
|
if (!openid || !userId) {
|
|
console.log('用户未登录，需要授权登录');
|
|
// 显示授权登录弹窗
|
|
wx.showToast({
|
|
title: '请先登录',
|
|
icon: 'none'
|
|
});
|
|
return;
|
|
}
|
|
|
|
const goodsItem = e.currentTarget.dataset.item;
|
|
// 获取嵌套在Product对象中的商品数据
|
|
const productData = goodsItem.Product;
|
|
// 跳转到商品详情页面，并传递商品数据，使用encodeURIComponent编码JSON字符串
|
|
wx.navigateTo({
|
|
url: '/pages/goods-detail/goods-detail?goodsData=' + encodeURIComponent(JSON.stringify(productData))
|
|
});
|
|
},
|
|
|
|
// 轮播图切换
|
|
swiperChange(e) {
|
|
const current = e.detail.current;
|
|
const itemId = e.currentTarget.dataset.itemId;
|
|
|
|
// 更新对应商品项的currentImageIndex
|
|
this.setData({
|
|
[`favoritesList[${itemId}].currentImageIndex`]: current
|
|
});
|
|
},
|
|
|
|
// 预览图片
|
|
previewImage(e) {
|
|
// 登录验证
|
|
const userInfo = wx.getStorageSync('userInfo') || null;
|
|
const userId = wx.getStorageSync('userId') || null;
|
|
if (!userInfo || !userId) {
|
|
// 未登录，显示授权登录弹窗
|
|
this.setData({
|
|
showAuthModal: true,
|
|
pendingUserType: 'buyer'
|
|
});
|
|
return;
|
|
}
|
|
|
|
// 已登录，执行图片预览
|
|
const { urls, index } = e.currentTarget.dataset;
|
|
this.setData({
|
|
showImagePreview: true,
|
|
previewImageUrls: urls,
|
|
previewImageIndex: parseInt(index)
|
|
});
|
|
},
|
|
|
|
// 关闭图片预览
|
|
closeImagePreview() {
|
|
this.setData({
|
|
showImagePreview: false
|
|
});
|
|
this.resetZoom();
|
|
},
|
|
|
|
// 重置缩放状态
|
|
resetZoom() {
|
|
this.setData({
|
|
scale: 1,
|
|
lastScale: 1,
|
|
offsetX: 0,
|
|
offsetY: 0,
|
|
initialTouch: null
|
|
});
|
|
},
|
|
|
|
// 处理图片点击事件（单击/双击判断）
|
|
handleImageTap(e) {
|
|
const currentTime = Date.now();
|
|
const lastTapTime = this.data.lastTapTime;
|
|
|
|
// 判断是否为双击（300ms内连续点击）
|
|
if (currentTime - lastTapTime < 300) {
|
|
// 双击事件
|
|
if (this.data.doubleTapTimer) {
|
|
clearTimeout(this.data.doubleTapTimer);
|
|
}
|
|
|
|
// 切换放大/缩小状态
|
|
const newScale = this.data.scale === 1 ? 2 : 1;
|
|
this.setData({
|
|
scale: newScale,
|
|
lastScale: newScale,
|
|
offsetX: 0,
|
|
offsetY: 0,
|
|
lastTapTime: 0 // 重置双击状态
|
|
});
|
|
} else {
|
|
// 单击事件，设置延迟来检测是否会成为双击
|
|
if (this.data.doubleTapTimer) {
|
|
clearTimeout(this.data.doubleTapTimer);
|
|
}
|
|
|
|
this.setData({
|
|
lastTapTime: currentTime,
|
|
doubleTapTimer: setTimeout(() => {
|
|
// 确认是单击，关闭图片预览
|
|
this.closeImagePreview();
|
|
}, 300)
|
|
});
|
|
}
|
|
},
|
|
|
|
// 处理触摸开始事件
|
|
handleTouchStart(e) {
|
|
const touches = e.touches;
|
|
|
|
if (touches.length === 1) {
|
|
// 单指：准备拖动
|
|
this.setData({
|
|
initialTouch: {
|
|
x: touches[0].clientX,
|
|
y: touches[0].clientY
|
|
}
|
|
});
|
|
} else if (touches.length === 2) {
|
|
// 双指：记录起始距离，准备缩放
|
|
const distance = this.calculateDistance(touches[0], touches[1]);
|
|
this.setData({
|
|
startDistance: distance,
|
|
isScaling: true,
|
|
lastScale: this.data.scale
|
|
});
|
|
}
|
|
},
|
|
|
|
// 处理触摸移动事件
|
|
handleTouchMove(e) {
|
|
const touches = e.touches;
|
|
|
|
if (touches.length === 1 && this.data.initialTouch && this.data.scale !== 1) {
|
|
// 单指拖动（只有在缩放状态下才允许拖动）
|
|
const deltaX = touches[0].clientX - this.data.initialTouch.x;
|
|
const deltaY = touches[0].clientY - this.data.initialTouch.y;
|
|
|
|
// 计算新的偏移量
|
|
let newOffsetX = this.data.offsetX + deltaX;
|
|
let newOffsetY = this.data.offsetY + deltaY;
|
|
|
|
// 边界限制
|
|
const windowWidth = wx.getSystemInfoSync().windowWidth;
|
|
const windowHeight = wx.getSystemInfoSync().windowHeight;
|
|
const maxOffsetX = (windowWidth * (this.data.scale - 1)) / 2;
|
|
const maxOffsetY = (windowHeight * (this.data.scale - 1)) / 2;
|
|
|
|
newOffsetX = Math.max(-maxOffsetX, Math.min(maxOffsetX, newOffsetX));
|
|
newOffsetY = Math.max(-maxOffsetY, Math.min(maxOffsetY, newOffsetY));
|
|
|
|
this.setData({
|
|
offsetX: newOffsetX,
|
|
offsetY: newOffsetY,
|
|
initialTouch: {
|
|
x: touches[0].clientX,
|
|
y: touches[0].clientY
|
|
}
|
|
});
|
|
} else if (touches.length === 2) {
|
|
// 双指缩放
|
|
const currentDistance = this.calculateDistance(touches[0], touches[1]);
|
|
const scale = (currentDistance / this.data.startDistance) * this.data.lastScale;
|
|
|
|
// 限制缩放范围在0.5倍到3倍之间
|
|
const newScale = Math.max(0.5, Math.min(3, scale));
|
|
|
|
this.setData({
|
|
scale: newScale,
|
|
isScaling: true
|
|
});
|
|
}
|
|
},
|
|
|
|
// 处理触摸结束事件
|
|
handleTouchEnd(e) {
|
|
this.setData({
|
|
isScaling: false,
|
|
lastScale: this.data.scale,
|
|
initialTouch: null
|
|
});
|
|
},
|
|
|
|
// 计算两点之间的距离
|
|
calculateDistance(touch1, touch2) {
|
|
const dx = touch2.clientX - touch1.clientX;
|
|
const dy = touch2.clientY - touch1.clientY;
|
|
return Math.sqrt(dx * dx + dy * dy);
|
|
},
|
|
|
|
// 切换预览图片
|
|
onPreviewImageChange(e) {
|
|
this.setData({
|
|
previewImageIndex: e.detail.current
|
|
});
|
|
this.resetZoom();
|
|
}
|
|
})
|