376 lines
13 KiB
JavaScript
376 lines
13 KiB
JavaScript
|
import dayjs from 'dayjs';
|
|||
|
|
import { couponsData } from './mock';
|
|||
|
|
import { request } from '../../../../services/_utils/request';
|
|||
|
|
|
|||
|
|
const emptyCouponImg = `https://tdesign.gtimg.com/miniprogram/template/retail/coupon/ordersure-coupon-newempty.png`;
|
|||
|
|
|
|||
|
|
Component({
|
|||
|
|
properties: {
|
|||
|
|
storeId: String,
|
|||
|
|
promotionGoodsList: {
|
|||
|
|
type: Array,
|
|||
|
|
value: [],
|
|||
|
|
},
|
|||
|
|
orderSureCouponList: {
|
|||
|
|
type: Array,
|
|||
|
|
value: [],
|
|||
|
|
},
|
|||
|
|
couponsShow: {
|
|||
|
|
type: Boolean,
|
|||
|
|
value: false,
|
|||
|
|
observer(couponsShow) {
|
|||
|
|
console.log('selectCoupons observer 触发:', { couponsShow });
|
|||
|
|
if (couponsShow) {
|
|||
|
|
console.log('开始处理优惠券显示逻辑');
|
|||
|
|
const { promotionGoodsList, orderSureCouponList, storeId } = this.data;
|
|||
|
|
console.log('组件数据:', { promotionGoodsList, orderSureCouponList, storeId });
|
|||
|
|
const products =
|
|||
|
|
promotionGoodsList &&
|
|||
|
|
promotionGoodsList.map((goods) => {
|
|||
|
|
this.storeId = goods.storeId;
|
|||
|
|
return {
|
|||
|
|
skuId: goods.skuId,
|
|||
|
|
spuId: goods.spuId,
|
|||
|
|
storeId: goods.storeId,
|
|||
|
|
selected: true,
|
|||
|
|
quantity: goods.num,
|
|||
|
|
prices: {
|
|||
|
|
sale: goods.settlePrice,
|
|||
|
|
},
|
|||
|
|
};
|
|||
|
|
});
|
|||
|
|
const selectedCoupons =
|
|||
|
|
orderSureCouponList &&
|
|||
|
|
orderSureCouponList.map((ele) => {
|
|||
|
|
return {
|
|||
|
|
promotionId: ele.promotionId,
|
|||
|
|
storeId: ele.storeId,
|
|||
|
|
couponId: ele.couponId,
|
|||
|
|
};
|
|||
|
|
});
|
|||
|
|
this.setData({
|
|||
|
|
products,
|
|||
|
|
});
|
|||
|
|
this.coupons({
|
|||
|
|
products,
|
|||
|
|
selectedCoupons,
|
|||
|
|
storeId,
|
|||
|
|
}).then((res) => {
|
|||
|
|
this.initData(res);
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
},
|
|||
|
|
},
|
|||
|
|
data: {
|
|||
|
|
emptyCouponImg,
|
|||
|
|
goodsList: [],
|
|||
|
|
selectedList: [],
|
|||
|
|
couponsList: [],
|
|||
|
|
orderSureCouponList: [],
|
|||
|
|
promotionGoodsList: [],
|
|||
|
|
},
|
|||
|
|
lifetimes: {
|
|||
|
|
attached() {
|
|||
|
|
console.log('selectCoupons组件已挂载');
|
|||
|
|
},
|
|||
|
|
ready() {
|
|||
|
|
console.log('selectCoupons组件已准备就绪');
|
|||
|
|
console.log('组件属性值:', {
|
|||
|
|
couponsShow: this.properties.couponsShow,
|
|||
|
|
storeId: this.properties.storeId,
|
|||
|
|
promotionGoodsListLength: this.properties.promotionGoodsList.length,
|
|||
|
|
orderSureCouponListLength: this.properties.orderSureCouponList.length
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
methods: {
|
|||
|
|
initData(data = {}) {
|
|||
|
|
console.log('initData方法被调用:', data);
|
|||
|
|
const { couponResultList = [], reduce = 0 } = data;
|
|||
|
|
const { orderSureCouponList } = this.data;
|
|||
|
|
console.log('initData - orderSureCouponList:', orderSureCouponList);
|
|||
|
|
|
|||
|
|
const selectedList = [];
|
|||
|
|
let selectedNum = 0;
|
|||
|
|
const couponsList =
|
|||
|
|
couponResultList &&
|
|||
|
|
couponResultList.map((coupon) => {
|
|||
|
|
const { status, couponVO } = coupon;
|
|||
|
|
const { couponId, condition = '', endTime = 0, name = '', startTime = 0, value, type } = couponVO;
|
|||
|
|
|
|||
|
|
// 检查当前优惠券是否在已选列表中
|
|||
|
|
const isSelected = orderSureCouponList && orderSureCouponList.some(selectedCoupon => {
|
|||
|
|
return selectedCoupon.key === couponId ||
|
|||
|
|
selectedCoupon.couponId === couponId ||
|
|||
|
|
selectedCoupon.id === couponId;
|
|||
|
|
});
|
|||
|
|
|
|||
|
|
console.log(`initData - 优惠券 ${name} (ID: ${couponId}) 是否已选: ${isSelected}`);
|
|||
|
|
|
|||
|
|
if (isSelected) {
|
|||
|
|
selectedNum++;
|
|||
|
|
selectedList.push({
|
|||
|
|
userCouponId: coupon.id, // 用户优惠券ID，用于后端验证所有权
|
|||
|
|
id: coupon.id, // 保持兼容性
|
|||
|
|
couponId,
|
|||
|
|
promotionId: couponId, // 使用couponId作为promotionId
|
|||
|
|
storeId: this.storeId,
|
|||
|
|
key: couponId,
|
|||
|
|
// 添加调试信息
|
|||
|
|
_debug: {
|
|||
|
|
userCouponId: coupon.id,
|
|||
|
|
couponTemplateId: couponId
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
const val = value; // 直接使用原始值，ui-coupon-card组件会自动处理单位转换
|
|||
|
|
return {
|
|||
|
|
id: coupon.id, // 用户优惠券ID，用于后端验证所有权
|
|||
|
|
key: couponId, // 保持原有的key逻辑
|
|||
|
|
couponId: couponId, // 优惠券模板ID
|
|||
|
|
title: name,
|
|||
|
|
isSelected: isSelected,
|
|||
|
|
timeLimit: this.formatTimeLimit(startTime, endTime),
|
|||
|
|
value: val,
|
|||
|
|
status: status === -1 ? 'useless' : 'default',
|
|||
|
|
desc: condition,
|
|||
|
|
type,
|
|||
|
|
tag: '',
|
|||
|
|
};
|
|||
|
|
});
|
|||
|
|
console.log('initData设置数据:', { selectedList, couponsList, reduce, selectedNum });
|
|||
|
|
this.setData({
|
|||
|
|
selectedList,
|
|||
|
|
couponsList,
|
|||
|
|
reduce,
|
|||
|
|
selectedNum,
|
|||
|
|
});
|
|||
|
|
},
|
|||
|
|
selectCoupon(e) {
|
|||
|
|
const { key } = e.currentTarget.dataset;
|
|||
|
|
const { couponsList } = this.data;
|
|||
|
|
|
|||
|
|
// 先清除所有选中状态（假设一次只能选择一张优惠券）
|
|||
|
|
couponsList.forEach((coupon) => {
|
|||
|
|
coupon.isSelected = false;
|
|||
|
|
});
|
|||
|
|
|
|||
|
|
// 设置当前选中的优惠券
|
|||
|
|
const selectedCoupon = couponsList.find((coupon) => coupon.key === key);
|
|||
|
|
if (selectedCoupon) {
|
|||
|
|
selectedCoupon.isSelected = true;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
const couponSelected = couponsList.filter((coupon) => coupon.isSelected === true);
|
|||
|
|
|
|||
|
|
// 转换为后端期望的数据格式
|
|||
|
|
const selectedListForBackend = couponSelected.map(coupon => ({
|
|||
|
|
userCouponId: coupon.id, // 用户优惠券ID，用于后端验证所有权
|
|||
|
|
id: coupon.id, // 保持兼容性
|
|||
|
|
couponId: coupon.couponId, // 优惠券模板ID，用于获取优惠券信息
|
|||
|
|
key: coupon.key,
|
|||
|
|
promotionId: coupon.couponId, // 使用couponId作为promotionId
|
|||
|
|
storeId: this.storeId,
|
|||
|
|
// 添加调试信息
|
|||
|
|
_debug: {
|
|||
|
|
originalCoupon: coupon,
|
|||
|
|
userCouponId: coupon.id,
|
|||
|
|
couponTemplateId: coupon.couponId
|
|||
|
|
}
|
|||
|
|
}));
|
|||
|
|
|
|||
|
|
this.setData({
|
|||
|
|
selectedList: selectedListForBackend,
|
|||
|
|
couponsList: [...couponsList],
|
|||
|
|
});
|
|||
|
|
|
|||
|
|
console.log('优惠券选择:', {
|
|||
|
|
selectedKey: key,
|
|||
|
|
selectedCoupon,
|
|||
|
|
couponSelected,
|
|||
|
|
selectedListForBackend
|
|||
|
|
});
|
|||
|
|
|
|||
|
|
this.triggerEvent('sure', {
|
|||
|
|
selectedList: selectedListForBackend,
|
|||
|
|
});
|
|||
|
|
},
|
|||
|
|
hide() {
|
|||
|
|
this.setData({
|
|||
|
|
couponsShow: false,
|
|||
|
|
});
|
|||
|
|
},
|
|||
|
|
onPopupVisibleChange(e) {
|
|||
|
|
const { visible } = e.detail;
|
|||
|
|
console.log('弹窗状态变化:', visible);
|
|||
|
|
|
|||
|
|
// 只有当弹窗被关闭时才触发父组件的状态更新
|
|||
|
|
if (!visible && this.data.couponsShow) {
|
|||
|
|
// 通知父组件关闭弹窗
|
|||
|
|
this.triggerEvent('close');
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
async coupons(params = {}) {
|
|||
|
|
console.log('coupons方法被调用:', params);
|
|||
|
|
try {
|
|||
|
|
// 计算订单总金额
|
|||
|
|
const calculatedAmount = this.calculateOrderAmount();
|
|||
|
|
// 确保订单金额至少为1，避免后端验证错误
|
|||
|
|
const orderAmount = calculatedAmount > 0 ? calculatedAmount : 100;
|
|||
|
|
console.log('计算的订单金额:', calculatedAmount, '使用的订单金额:', orderAmount);
|
|||
|
|
|
|||
|
|
// 调用API获取可用优惠券
|
|||
|
|
const response = await request({
|
|||
|
|
url: `/coupons/order/available?order_amount=${orderAmount}`,
|
|||
|
|
method: 'GET'
|
|||
|
|
});
|
|||
|
|
|
|||
|
|
console.log('优惠券API响应:', response);
|
|||
|
|
|
|||
|
|
if (response.code === 200 && response.data) {
|
|||
|
|
const formattedData = this.formatCouponsData(response.data);
|
|||
|
|
console.log('格式化后的优惠券数据:', formattedData);
|
|||
|
|
|
|||
|
|
// 返回符合initData期望的格式
|
|||
|
|
return {
|
|||
|
|
couponResultList: formattedData.map(coupon => ({
|
|||
|
|
status: coupon.status === 'default' ? 1 : 0,
|
|||
|
|
id: coupon.id, // 用户优惠券ID
|
|||
|
|
couponVO: {
|
|||
|
|
couponId: coupon.couponId,
|
|||
|
|
name: coupon.name,
|
|||
|
|
type: coupon.type,
|
|||
|
|
value: coupon.value,
|
|||
|
|
condition: coupon.desc,
|
|||
|
|
startTime: coupon.startTime,
|
|||
|
|
endTime: coupon.endTime
|
|||
|
|
}
|
|||
|
|
})),
|
|||
|
|
reduce: 0
|
|||
|
|
};
|
|||
|
|
} else {
|
|||
|
|
console.error('获取优惠券失败:', response.message);
|
|||
|
|
return { couponResultList: [], reduce: 0 };
|
|||
|
|
}
|
|||
|
|
} catch (error) {
|
|||
|
|
console.error('获取优惠券异常:', error);
|
|||
|
|
// 如果API调用失败，返回mock数据作为备选
|
|||
|
|
console.log('使用mock数据:', couponsData);
|
|||
|
|
return {
|
|||
|
|
couponResultList: couponsData.couponResultList || [],
|
|||
|
|
reduce: couponsData.reduce || 0
|
|||
|
|
};
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
// 计算订单总金额
|
|||
|
|
calculateOrderAmount() {
|
|||
|
|
const { promotionGoodsList } = this.data;
|
|||
|
|
let totalAmount = 0;
|
|||
|
|
|
|||
|
|
if (promotionGoodsList && promotionGoodsList.length > 0) {
|
|||
|
|
promotionGoodsList.forEach(store => {
|
|||
|
|
if (store.goodsList && store.goodsList.length > 0) {
|
|||
|
|
store.goodsList.forEach(item => {
|
|||
|
|
totalAmount += (item.price || 0) * (item.quantity || 1);
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
return totalAmount;
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
// 格式化优惠券数据
|
|||
|
|
formatCouponsData(coupons) {
|
|||
|
|
const { orderSureCouponList } = this.data;
|
|||
|
|
console.log('formatCouponsData - orderSureCouponList:', orderSureCouponList);
|
|||
|
|
|
|||
|
|
return coupons.map(userCoupon => {
|
|||
|
|
const coupon = userCoupon.coupon;
|
|||
|
|
|
|||
|
|
// 检查当前优惠券是否在已选列表中
|
|||
|
|
const isSelected = orderSureCouponList && orderSureCouponList.some(selectedCoupon => {
|
|||
|
|
return selectedCoupon.key === userCoupon.id ||
|
|||
|
|
selectedCoupon.couponId === coupon.id ||
|
|||
|
|
selectedCoupon.id === userCoupon.id;
|
|||
|
|
});
|
|||
|
|
|
|||
|
|
console.log(`优惠券 ${coupon.name} (ID: ${coupon.id}) 是否已选: ${isSelected}`);
|
|||
|
|
|
|||
|
|
return {
|
|||
|
|
id: userCoupon.id,
|
|||
|
|
key: userCoupon.id, // 添加key字段用于选择
|
|||
|
|
couponId: coupon.id,
|
|||
|
|
name: coupon.name,
|
|||
|
|
title: coupon.name, // 添加title字段映射到name
|
|||
|
|
type: coupon.type,
|
|||
|
|
value: coupon.value, // 保持原始值，ui-coupon-card组件会自动除以100
|
|||
|
|
minAmount: coupon.min_amount,
|
|||
|
|
desc: this.getCouponDesc(coupon),
|
|||
|
|
timeLimit: this.formatTimeLimit(coupon.start_time, coupon.end_time),
|
|||
|
|
startTime: coupon.start_time,
|
|||
|
|
endTime: coupon.end_time,
|
|||
|
|
status: userCoupon.status === 0 ? 'default' : 'disabled',
|
|||
|
|
tag: '', // 添加tag字段
|
|||
|
|
isSelected: isSelected // 根据orderSureCouponList设置选中状态
|
|||
|
|
};
|
|||
|
|
});
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
// 获取优惠券描述
|
|||
|
|
getCouponDesc(coupon) {
|
|||
|
|
if (coupon.type === 1) { // 满减券
|
|||
|
|
if (coupon.min_amount > 0) {
|
|||
|
|
return `满${coupon.min_amount/100}元减${coupon.value/100}元`;
|
|||
|
|
}
|
|||
|
|
return `立减${coupon.value/100}元`;
|
|||
|
|
} else if (coupon.type === 2) { // 折扣券
|
|||
|
|
return `${coupon.value/10}折`;
|
|||
|
|
} else if (coupon.type === 3) { // 免邮券
|
|||
|
|
return '免运费';
|
|||
|
|
}
|
|||
|
|
return coupon.description || '优惠券';
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
// 格式化时间限制
|
|||
|
|
formatTimeLimit(startTime, endTime) {
|
|||
|
|
// 检查时间数据是否有效
|
|||
|
|
if (!startTime || !endTime) {
|
|||
|
|
console.warn('formatTimeLimit: 时间数据无效', { startTime, endTime });
|
|||
|
|
return '有效期待确认';
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
try {
|
|||
|
|
// 处理不同格式的时间数据
|
|||
|
|
let start, end;
|
|||
|
|
|
|||
|
|
// 如果是时间戳（数字或数字字符串）
|
|||
|
|
if (typeof startTime === 'number' || (typeof startTime === 'string' && /^\d+$/.test(startTime))) {
|
|||
|
|
start = dayjs(Number(startTime));
|
|||
|
|
} else {
|
|||
|
|
start = dayjs(startTime);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
if (typeof endTime === 'number' || (typeof endTime === 'string' && /^\d+$/.test(endTime))) {
|
|||
|
|
end = dayjs(Number(endTime));
|
|||
|
|
} else {
|
|||
|
|
end = dayjs(endTime);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
// 验证日期是否有效
|
|||
|
|
if (!start.isValid() || !end.isValid()) {
|
|||
|
|
console.warn('formatTimeLimit: 日期解析失败', { startTime, endTime });
|
|||
|
|
return '有效期待确认';
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
return `${start.format('YYYY.MM.DD')} - ${end.format('YYYY.MM.DD')}`;
|
|||
|
|
} catch (error) {
|
|||
|
|
console.error('formatTimeLimit: 格式化时间出错', error, { startTime, endTime });
|
|||
|
|
return '有效期待确认';
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
},
|
|||
|
|
});
|