小程序提交
This commit is contained in:
@ -1,88 +1,143 @@
|
||||
import { baseUrl } from "../../../request";
|
||||
|
||||
// pages/course/courseOrderList/courseOrderList.js
|
||||
Page({
|
||||
/**
|
||||
* 页面的初始数据
|
||||
*/
|
||||
data: {
|
||||
items: [null, null, null],
|
||||
countDown: 30 * 60 , // 初始倒计时
|
||||
countDownStr: '' // 用于在视图中渲染的倒计时文本
|
||||
orderList: [], // 后端返回的订单列表
|
||||
hasModalShown: false, // 弹框只显示一次
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面加载
|
||||
*/
|
||||
onLoad(options) {
|
||||
this.startCountDown();
|
||||
this.fetchOrders();
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面初次渲染完成
|
||||
*/
|
||||
onReady() {},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面显示
|
||||
*/
|
||||
onShow() {},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面隐藏
|
||||
*/
|
||||
onHide() {
|
||||
clearInterval(this.intervalId);
|
||||
clearInterval(this._timer);
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面卸载
|
||||
*/
|
||||
onUnload() {
|
||||
clearInterval(this.intervalId);
|
||||
clearInterval(this._timer);
|
||||
},
|
||||
onShow() {
|
||||
this.fetchOrders()
|
||||
},
|
||||
|
||||
/**
|
||||
* 启动倒计时
|
||||
*/
|
||||
startCountDown() {
|
||||
this.updateCountDownStr();
|
||||
this.intervalId = setInterval(() => {
|
||||
let cd = this.data.countDown;
|
||||
if (cd <= 1) {
|
||||
clearInterval(this.intervalId);
|
||||
this.setData({
|
||||
countDown: 0,
|
||||
countDownStr: '00分00秒'
|
||||
});
|
||||
} else {
|
||||
cd--;
|
||||
this.setData({ countDown: cd });
|
||||
this.updateCountDownStr();
|
||||
// 拉取后端接口
|
||||
fetchOrders() {
|
||||
wx.request({
|
||||
url: baseUrl + '/courseOrder/query/list', // 替换为真实接口
|
||||
method: 'POST',
|
||||
header: {
|
||||
Authorization: wx.getStorageSync('token')
|
||||
},
|
||||
success: res => {
|
||||
console.log('课程订单列表---->',res.data.data);
|
||||
if (res.data.code === 1) {
|
||||
const now = Date.now();
|
||||
let list = res.data.data.map(item => {
|
||||
// 计算从 createTime 到 now 剩余秒数
|
||||
const createMs = new Date(item.createTime.replace(/-/g,'/')).getTime();
|
||||
let diff = Math.floor((createMs + 30*60*1000 - now) / 1000);
|
||||
|
||||
// 只有“待支付”才需要倒计时、过期置“交易取消”
|
||||
if (item.orderStatus === '待支付') {
|
||||
if (diff <= 0) {
|
||||
item.orderStatus = '交易取消';
|
||||
diff = 0;
|
||||
// 首次检测到过期就弹框
|
||||
if (!this.data.hasModalShown) {
|
||||
wx.showModal({
|
||||
title: '提示',
|
||||
content: '订单超时未支付,已取消',
|
||||
showCancel: false
|
||||
});
|
||||
this.setData({ hasModalShown: true });
|
||||
}
|
||||
}
|
||||
item.countDown = diff;
|
||||
const m = Math.floor(diff / 60);
|
||||
const s = diff % 60;
|
||||
item.countDownStr = `${m}分${s < 10 ? '0'+s : s}秒`;
|
||||
} else {
|
||||
item.countDown = 0;
|
||||
item.countDownStr = '';
|
||||
}
|
||||
return item;
|
||||
});
|
||||
|
||||
this.setData({ orderList: list }, () => {
|
||||
// 初始处理完后启动全局定时器
|
||||
this.startTimer();
|
||||
});
|
||||
|
||||
} else {
|
||||
wx.showToast({ title: res.data.message || '获取失败', icon: 'none' });
|
||||
}
|
||||
},
|
||||
fail: () => {
|
||||
wx.showToast({ title: '网络错误', icon: 'none' });
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
// 每秒更新所有待支付订单的倒计时
|
||||
startTimer() {
|
||||
this._timer = setInterval(() => {
|
||||
const updated = this.data.orderList.map(item => {
|
||||
if (item.orderStatus === '待支付' && item.countDown > 0) {
|
||||
const cd = item.countDown - 1;
|
||||
item.countDown = cd;
|
||||
const m = Math.floor(cd / 60);
|
||||
const s = cd % 60;
|
||||
item.countDownStr = `${m}分${s < 10 ? '0'+s : s}秒`;
|
||||
|
||||
if (cd <= 0) {
|
||||
item.orderStatus = '交易取消';
|
||||
item.countDownStr = '';
|
||||
if (!this.data.hasModalShown) {
|
||||
wx.showModal({
|
||||
title: '提示',
|
||||
content: '订单超时未支付,已取消',
|
||||
showCancel: false
|
||||
});
|
||||
this.setData({ hasModalShown: true });
|
||||
}
|
||||
}
|
||||
}
|
||||
return item;
|
||||
});
|
||||
this.setData({ orderList: updated });
|
||||
}, 1000);
|
||||
},
|
||||
|
||||
/**
|
||||
* 更新倒计时显示字符串
|
||||
*/
|
||||
updateCountDownStr() {
|
||||
const minutes = Math.floor(this.data.countDown / 60);
|
||||
const seconds = this.data.countDown % 60;
|
||||
const str = `${minutes}分${seconds < 10 ? '0' + seconds : seconds}秒`;
|
||||
this.setData({ countDownStr: str });
|
||||
// 跳转订单详情
|
||||
gotoOrderDetail(e) {
|
||||
const orderId = e.currentTarget.dataset.id;
|
||||
wx.navigateTo({
|
||||
url: `/pages/course/orderDetail/orderDetail?id=${orderId}`,
|
||||
})
|
||||
},
|
||||
|
||||
/**
|
||||
* 页面相关事件处理函数--监听用户下拉动作
|
||||
*/
|
||||
onPullDownRefresh() {},
|
||||
// 取消订单
|
||||
cancelOrder() {
|
||||
wx.showModal({
|
||||
title: '取消订单',
|
||||
content: '是否要取消订单?',
|
||||
success: res => {
|
||||
if (res.confirm) {
|
||||
wx.request({
|
||||
url: baseUrl + "/courseOrder/cancel",
|
||||
method: 'POST',
|
||||
data: { courseId: this.data.orderId },
|
||||
header: { Authorization: wx.getStorageSync('token') },
|
||||
success: () => this.getOrderDetail()
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
/**
|
||||
* 页面上拉触底事件的处理函数
|
||||
*/
|
||||
onReachBottom() {},
|
||||
|
||||
/**
|
||||
* 用户点击右上角分享
|
||||
*/
|
||||
onShareAppMessage() {}
|
||||
// 支付订单
|
||||
payOrder() {
|
||||
// wx.navigateTo({ url: `/pages/pay/pay?orderId=${this.data.orderId}` });
|
||||
wx.showToast({ title: '支付功能稍后开放', icon: 'none' });
|
||||
},
|
||||
});
|
||||
|
Reference in New Issue
Block a user